許多鏈接相同的jQuery動畫，如何更好地組織它們？

我有一個關於jQuery的問題 - 我正在研究大系統的菜單模擬，所以其他人可以玩這個，並決定如何更好地組織 - 可用性和用戶體驗的東西。許多鏈接相同的jQuery動畫，如何更好地組織它們？

菜單是多層次的，每個部分都必須是可拖動的 - 所以重要的（我猜）將所有部分保留在同一頁面中。但這不是我想問的其實。我有子菜單的菜單，所以它通過點擊菜單鏈接使用slideToggle（）類打開。

<script> 
    $("#terms").click(function() { 
    $("#1").slideToggle("slow"); 
    }); 
$("#tc").click(function() { 
    $("#tc-2").slideToggle("slow"); 
    }); 
</script>

我有很多那樣的聯繫，所以我不想寫代碼，每一個環節，我想這樣通過點擊鏈接它創建類似

<script> 
    $("a").click(function() { 
    $("#href").slideToggle("slow"); 
    }); 
</script>

只打開這個div，它與鏈接href具有相同的id。

對不起，我真的不知道如何解釋谷歌我想要的。

來源

2013-09-27 Narkolepsia

數據引用在瀏覽器不支持HTML5 –

一個方法是使用HTML5數據attribute..add所述肘節式元件到它的參考ID ......添加同一類的所有元素，並使用

$(".elementClass").click(function() { 
    $('#'+ $(this).data('reference')).slideToggle("slow"); 
});

例如HTML

<div id="terms" class="elementClass" data-reference="1"></div> 
<div id="1"></div> 
<div id="tc" class="elementClass" data-reference="tc-2"></div> 
<div id="tc-2"></div>

注意：最好避免使用數字值作爲ID。使用字符串。

來源

2013-09-27 06:21:01 bipen

數據引用在瀏覽器不支持HTML5沒有工作，所以用這個代碼

 $(".elementClass").click(function() { 
     $('#'+ $(this).attr('id')+'-div').slideToggle("slow"); 
    }); 

example HTML 

    <div id="terms-1" class="elementClass"></div> 
    <div id="terms-1-div"></div> 
    <div id="tc-2" class="elementClass"></div> 
    <div id="tc-2-div"></div>

來源

2013-09-27 06:43:37

既然是測試系統無法正常工作 - 我不認爲支持所有瀏覽器在這裏很重要。但它在一些實際項目中可能會有用。所以謝謝你的解決方案:) – Narkolepsia

許多鏈接相同的jQuery動畫，如何更好地組織它們？

回答

相關問題