2016-09-25 3 views
0

Я хочу сделать мой li активным с помощью javascript. Но проблема в том, что он не работает, когда только один клик. Вам нужно два последовательных щелчка, прежде чем они будут активны. Может кто-нибудь мне помочь?Сделать li активным через javascript

<li data-popover="true" rel="popover" data-placement="right"><a href="#" data-target=".premium-menu" class="nav-header collapsed" data-toggle="collapse"><i class="fa fa-fw fa-book"></i> Lectures<i class="fa fa-collapse"></i></a></li> 
    <li><ul class="premium-menu nav nav-list collapse in"> 
    <?php 
     $sql ="SELECT enroll_ref FROM std_enrolled WHERE stud_no = '$stud_no'"; 
      $result = mysqli_query($con, $sql); 

      while($row = mysqli_fetch_array($result)){ 
      $enroll_ref = $row['enroll_ref']; 
      } 



       $sql3 ="SELECT DISTINCT subj_descr FROM subj_enrolled WHERE enroll_ref = '$enroll_ref'"; 
      $results = mysqli_query($con, $sql3); 
      while($row = mysqli_fetch_array($results)){ 
      $subj_descr = $row['subj_descr']; 

    ?> 

     <li><a class="item" href="viewlecture.php?subjdescr=<?php echo $subj_descr;?>"><span class="fa fa-caret-right"></span><?php echo ucwords(strtolower($subj_descr)); ?></a></li> 
    <?php 
     } 
    ?> 
</ul></li> 

<script type="text/javascript"> 

$(".item").click(function() { 
     $(this).parent('li').addClass("active"); 
}); 

</script> 
+0

Если элемент, нажатый на него, является якорем, это не значит, что страница для перехода к указанному URL-адресу, эффективно перезагружая страницу? Вот почему активная вещь класса работает только если вы нажмете элемент списка для текущей страницы. (Кроме того, ваш HTML недопустим, потому что вы создаете повторяющиеся идентификаторы.) – nnnnnn

+0

Я уже удаляю 'id' sir, но все тот же. Необходимо активировать клики. – wataru

+0

Но, как я уже сказал, нажатие ссылки * заставляет страницу перезагружать *, поэтому любые изменения, внесенные вами в JS для установки активной, будут потеряны. Вы можете обновить цикл PHP, чтобы добавить серверную сторону класса. Или вы можете обновить JS для запуска на документе, готовом проверить текущую строку запроса URL-адреса страницы, чтобы узнать, какой элемент должен быть выбран, а затем добавить активный класс. – nnnnnn

ответ

0
  • Установите на стороне сервера класса, если список ссылок в каждом viewlecture.php ИЛИ
  • Ajax страница

    $(".item").on("click",function(e) { 
        e.preventDefault(); // stop link from reloading the page 
        $("#lectureContainer").load(this.href); // load the lecture into a div or so 
        $(this).closest("ul").find("li").removeClass("active"); 
        $(this).parent('li').addClass("active"); 
    }); 
    

Для других примеров смотрите здесь Set active link based on URL

Смежные вопросы