简体   繁体   中英

Why it has been clicked twice?

<li class="nav-parent">
    <a><i class="fa fa-list-alt" aria-hidden="true</i><span>Forms</span>
    </a>
    <ul class="nav nav-children" id="dd">
       <li>
          <a href="{:url('edit/Form/getone')}"><span class="text"> Editors</span>
          </a>
      </li>
      <li>
          <a href="{:url('edit/Form/getone')}"><span class="text"> Editors</span>
          </a>
      </li>
    </ul>
</li>

Hi, as you can see i have a nav bar section, i am using click function, but when i click, it alerts twice. does anyone know why? thanks li

   $('li.nav-parent ul li a').click(function(){
    alert(1);

   });

I Guess there is a issue in your HTML Construct near

<li class="nav-parent">
   <a><i class="fa fa-list-alt" aria-hidden="true</i><span>Forms</span>
</a>

In above code <i class="fa fa-list-alt" aria-hidden="true</i> is not properly closed.

Try Below one

 $(function(){ $('li.nav-parent ul li a').click(function(e) { e.preventDefault(); alert(1); }); }) 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <li class="nav-parent"> <a> <i class="fa fa-list-alt" aria-hidden="true"></i> <span>Forms</span> </a> <ul class="nav nav-children" id="dd"> <li> <a href="{:url('edit/Form/getone')}"> <span class="text"> Editors</span> </a> </li> <li> <a href="{:url('edit/Form/getone')}"> <span class="text"> Editors</span> </a> </li> </ul> </li> 

error in your code: <a><i class="fa fa-list-alt" aria-hidden="true</i><span>Forms</span> missing " before </i> after fix, alerts only once. https://jsfiddle.net/u4s7wmhg/1/

as pointed out by other user you have misplaced > in your code.

Also what you are trying to select in your jquery which has two matches (event propagation due to unclosed braces ) ie $('li.nav-parent ul li a') has matches for each li and that's causing the event to fire twice for each li > a element click.

thank you guys. but it is not because of that. :( the reason i just found out is because I loaded this click function twice somehow in somewhere. But thank your effort.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM