4

SOLUTION:

Found a solution.

Used 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');
      }
   }
});

I have a menu like this:

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

I have tried the following in jQuery:

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

However this disables all the elements in the whole menu structure. I want to only disable the parent links. The ones in "ul li", and not the links in "ul ul li", but I can't figure out how and I have searched and searched. So please help me out!


EDIT: Thank you for the answers. I thought I would simplify my code in the question but that actually didn't benifit me. So heres the actual code I'm using:

$('.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');
      }
   }
});

And the 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>

If I try to do as you suggest and set it to:

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

It doesn't work..

2
  • Consider changing your selector to point to an anchor tag instead of the LI: $('.parent a') Mar 14, 2013 at 19:05
  • Have you tried $('.parent a').click(function(e) { e.preventDefault(); });?
    – Sven
    Mar 14, 2013 at 19:05

3 Answers 3

8

Similar to Austin Mullins' answer, I think you want this:

$('li.parent > a').click(function(e) {
    e.preventDefault();
});
2
  • 1
    That's what I call scope creep. :) Mar 14, 2013 at 22:56
  • Your absolutely correct :-) Guess, I learned my mistake and will start with the actual code I used another time :D Mar 14, 2013 at 23:17
0

Try this:

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

The > only matches immediate children of the previous tag.

0

This works for me on jsbin:

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

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

0

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.