你好我有一個菜單。我想爲每個父級菜單添加一個toogle動畫。但目前我卡住了，因爲當我點擊父菜單。所有父母菜單顯示他們的子菜單。我想我需要一個jQuery的每個功能，但我不知道如何執行我的情況。繼承人我的代碼jquery每個功能的菜單

$(".menu-item-has-children").prepend("<i></i>"); 
$(".menu-item-has-children").find("i").addClass("fa fa-plus-circle toogle-icon"); 
$(".toogle-icon").click(function(){ 
    $(".sub-menu").slideToggle(); 
});

繼承人的jsfiddle https://jsfiddle.net/Lypj8tov/1/

來源

2016-09-28 antonscie

嘗試：

$(".toogle-icon").click(function(){ 
    $(this).parent('.menu-item-has-children').find(".sub-menu").slideToggle(); 
});

你也可以簡化整個事情：

$('<i class="fa fa-plus-circle toogle-icon"></i>') 
    .click(function(){ 
    $(this).parent().find(".sub-menu").slideToggle(); 
    }) 
    .prependTo(".menu-item-has-children");

檢查https://fiddle.jshell.net/ermakovnikolay/q5z4b64u/

來源

2016-09-28 14:43:47

$(".toogle-icon").click(function(){ 
    $(this).closest('.menu-item-has-children').find(".sub-menu").slideToggle(); 
});

@Nikolay Ermakov謝謝你，你爲什麼刪除你的答案？它有一個錯誤？

來源

2016-09-28 14:46:53 antonscie

我回來）） –

生病標記您的文章作爲回答花花公子 – antonscie

謝謝，夥計。檢查一下改進。 –

您需要將相關元素引用到單擊的實例。使用this：

$(".toogle-icon").click(function(){ 
    $(this).siblings('.sub-menu').slideToggle(); 
});

Fiddle Demo

來源

2016-09-28 14:46:54 DaniP

解決方案：

$(".toogle-icon").click(function(){ 
    $(this).parent().find(".sub-menu").slideToggle(); 
});

來源

2016-09-28 14:47:26

jquery每個功能的菜單

回答

Fiddle Demo

相關問題