javascript preventDefault仅在父项上 [英] javascript preventDefault only on parent item
本文介绍了javascript preventDefault仅在父项上的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在使用javascript创建下拉导航.有孩子的任何列表项我都想阻止默认操作并执行其他操作.我已经完成了这项工作,但是当应用默认操作时,它也会应用于子列表项.
I am creating a drop down nav in javascript. Any list items that have children i would like to prevent the default action and do something else. I have this working but when applied the default action is also applied to the child list items.
这是我的HTML:
<i id="mobnavtrig" class="fa fa-align-justify fa-2x"></i>
<div class="mobilenav">
<li class="page_item page-item-2"><a href="/">Home</a></li>
<li class="page_item page-item-10"><a href="?page_id=10">Who We Are</a></li>
<li class="page_item page-item-25 page_item_has_children current_page_item parent"><a href="?page_id=25">Case Studies</a>
<ul class='children'>
<li class="page_item page-item-55"><a href="?page_id=55">Barratt Developments</a></li>
<li class="page_item page-item-53"><a href="?page_id=53">Care in Bathing</a></li>
</ul>
</li>
<li class="page_item page-item-27"><a href="?page_id=27">Blog</a></li>
<li class="page_item page-item-29"><a href="?page_id=29">Get In Touch</a></li>
</div>
这是我的JS:
$( ".mobilenav li.parent" ).click(function(event) {
if($(this).hasClass('page_item_has_children')){
event.preventDefault( );
$(this).addClass('current_page_item');
$(this).find('.children').slideToggle("fast");
}
});
以上是否缺少我的东西?
Is there something i am missing in the above?
推荐答案
in children click you have to use stopPropagation() to stop event bubbling
$( ".mobilenav li.parent .children" ).click(function(e){
e.stopPropagation();
});
这篇关于javascript preventDefault仅在父项上的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文