jQuery:仅在父链接上使用preventDefault

时间:2013-03-14 19:03:03

标签: jquery menu parent-child parent preventdefault

解决方案:

找到解决方案。

使用的parentNode:

$('.skaftetopmenu-li > a').click(function(e) {
   e.preventDefault();
   var subid = $(this.parentNode).attr('id');
   if (subid !="forsidemenu"){
      var str = $('#submenu-content-'+subid).html();
      if ($.trim(str) == ""){
         $('.submenu-content', this.parentNode).load('http://' + skafte.base_url + '/inc/top-menu-subs/'+subid+'_submenu.html');
      }
   }
});

我有一个这样的菜单:

<ul>
  <li class="parent">
    <a href="url">Link title parent</a>
    <ul>
      <li><a href="url">Link title child</a></li>
    </ul>
  </li>
</ul>

我在jQuery中尝试了以下内容:

$('.parent').click(function(e) {
  e.preventDefault();
});

然而,这会禁用整个菜单结构中的所有元素。我想只禁用父链接。 “ul li”中的那些,而不是“ul ul li”中的链接,但我无法弄清楚我是如何搜索和搜索的。所以请帮帮我!


编辑:谢谢你的回答。我以为我会在问题中简化我的代码,但实际上并没有让我受益。接下来是我正在使用的实际代码:

$('.skaftetopmenu-li').click(function(e) {

   var subid = $(this).attr('id');

   if (subid !="forsidemenu"){

      var str = $('#submenu-content-'+subid).html();

      if ($.trim(str) == ""){

         $('.submenu-content', this).load('http://' + skafte.base_url + '/inc/top-menu-subs/'+subid+'_submenu.html');
      }
   }
});

HTML:

<li class="skaftetopmenu-li" id="priser">
   <a href="http://<?php echo DOMAIN?>/priser.php">Priser &amp; Sortiment</a>
   <div class="submenu-content" id="submenu-content-priser"></div>
</li>

如果我尝试按照您的建议进行操作并将其设置为:

$('.skaftetopmenu-li > a').click(function(e) {
   e.preventDefault();

它不起作用..

3 个答案:

答案 0 :(得分:7)

与Austin Mullins的回答类似,我想你想要这个:

$('li.parent > a').click(function(e) {
    e.preventDefault();
});

答案 1 :(得分:0)

试试这个:

$(".parent > ul > li > a").click( function(e) {
    e.preventDefault();
    // ...
});

>仅匹配上一个标记的直接子项。

答案 2 :(得分:0)

这适用于jsbin:

$('.parent>a').on('click', function( e ){
   e.preventDefault();
} );

http://jsbin.com/irojiq/1/edit