活动标签时在 li 标签中插入 span 标签

insert span tag in li tag when active tab

我有 gk5 标签扩展 joomla 当使用 motools 激活选项卡时,将 "active" 插入 li 的 class,如下所示:

    <li data-animation="default" class="gkTab gkTabs-1 active ">
            <span></span>           
    </li>
    <li data-animation="default" class="gkTab gkTabs-2">
            <span></span>           
    </li>

我需要在选项卡处于活动状态时将 html 标记插入 li 中,如下所示:

  <ol class="gkTabsNav">

    <li data-animation="default" class="gkTab gkTabs-1 active ">
            asdasdsadsad    
    <span class="simple"></span>        
    </li>
    <li data-animation="default" class="gkTab gkTabs-2">
            asdsdasdasdsd           
    </li>

这个地方的 php 来源是:

<ol class="gkTabsNav">
        <?php if($this->config['tabs_pre_text'] != '') : ?>
        <li class="gkTabsPreText"><strong><?php echo $this->config['tabs_pre_text']; ?></strong></li>
        <?php endif ; ?>

        <?php for($i = 0; $i < count($this->tabs["title"]); $i++) : ?>
        <?php $active_class = ($this->active_tab == $i + 1) ? ' active' : ''; ?>
        <li<?php if($this->tabs["id"][$i] != '') echo ' id="'.($this->tabs['id'][$i]).'"'; ?> class="gkTab gkTabs-<?php echo ($i+1) . $active_class; ?>" data-animation="<?php echo $this->tabs['animation'][$i]!= '' ? $this->tabs['animation'][$i] : 'default'; ?>">
            <?php if($this->config['tabs_spans'] == '1'): ?><span><?php endif; ?>
                <?php echo $this->tabs["title"][$i]; ?>
            <?php if($this->config['tabs_spans'] == '1'): ?></span><?php endif; ?>
        </li>
        <?php endfor; ?>
 </ol>

给你 以 <li<?php if($this->tabs["id"][$i] != '') echo ' id="'.($this->tabs 开头的行的末尾是添加文本的位置,class 是在此行中添加的 <?php if($this->config['tabs_spans'] == '1'): ?><span class="arr">

<ol class="gkTabsNav">
        <?php if($this->config['tabs_pre_text'] != '') : ?>
        <li class="gkTabsPreText"><strong><?php echo $this->config['tabs_pre_text']; ?></strong></li>
        <?php endif ; ?>

        <?php for($i = 0; $i < count($this->tabs["title"]); $i++) : ?>
        <?php $active_class = ($this->active_tab == $i + 1) ? ' active' : ''; ?>
        <li<?php if($this->tabs["id"][$i] != '') echo ' id="'.($this->tabs['id'][$i]).'"'; ?> class="gkTab gkTabs-<?php echo ($i+1) . $active_class; ?>" data-animation="<?php echo $this->tabs['animation'][$i]!= '' ? $this->tabs['animation'][$i] : 'default'; ?>">asadasadasadasa
            <?php if($this->config['tabs_spans'] == '1'): ?><span class="arr"><?php endif; ?>
                <?php echo $this->tabs["title"][$i]; ?>
            <?php if($this->config['tabs_spans'] == '1'): ?></span><?php endif; ?>
        </li>
        <?php endfor; ?>
 </ol>

嗨,对于这个问题,我在代码中插入了 span 标签:

<ol class="gkTabsNav">
        <?php if($this->config['tabs_pre_text'] != '') : ?>
        <li class="gkTabsPreText"><strong><?php echo $this->config['tabs_pre_text']; ?></strong></li>
        <?php endif ; ?>

        <?php for($i = 0; $i < count($this->tabs["title"]); $i++) : ?>
        <?php $active_class = ($this->active_tab == $i + 1) ? ' active' : ''; ?>
        <li<?php if($this->tabs["id"][$i] != '') echo ' id="'.($this->tabs['id'][$i]).'"'; ?> class="gkTab gkTabs-<?php echo ($i+1) . $active_class; ?>" data-animation="<?php echo $this->tabs['animation'][$i]!= '' ? $this->tabs['animation'][$i] : 'default'; ?>">
            <?php if($this->config['tabs_spans'] == '1'): ?><span><?php endif; ?>
                <?php echo $this->tabs["title"][$i]; ?>
            <?php if($this->config['tabs_spans'] == '1'): ?></span><?php endif; ?>
            <span class="simple"></span>
        </li>
        <?php endfor; ?>
    </ol>

比将此 css 插入 css 文件:

.gkTabsWrap.horizontal ol li.active .simple {
  background: url("arrow-ama.png") no-repeat scroll 0px 0 rgba(0, 0, 0, 0) !important;
  display: block !important;
  height: 29px;
  position: absolute;
  left: -15px;
  top: 0;
  width: 15px;
}
.simple {
  display: none;

}