Question

I’m currently using:

$(".navigation ul ul, .shoppingbasket ul ul").css({display: "none"});
$(".navigation ul li, .shoppingbasket ul li").click(function(){
    $(this).find('ul:first').slideToggle(400);
});

I’m wanting to disable parent li if has child items

$(".navigation ul li:has(ul)").hover(function () {
$(this).children("a").click(function () {
return false;
});
});

But they seem to be stopping each other from working together, does anyone have any idea how to fix this problem?

See link to see my problem
http://www.media21a.co.uk/clientlogin/benaiahmatheson/benaiah-matheson/profile/

Answer 1

I believe you’re trying to get the click event for a parent LI anchor tag to not load a page, but instead display the children LI elements. This will prevent the loading of a page based on a click event on a parent LI anchor element if there is a nested UL.

$('.navigation ul li a').click(function(e){
    if($(this).parent().find('ul')){
        e.preventDefault();
    }
});