许多链接与相同的jquery动画，如何更好地组织它们？
许多链接与相同的jquery动画，如何更好地组织它们？
提问于 2013-09-27 06:18:17
我有一个关于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，该div具有与链接href相同的id。
对不起，我不知道如何解释谷歌我想要什么。
回答 2
Stack Overflow用户
回答已采纳
发布于 2013-09-27 06:21:01
一种方法是使用切换元素的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>注意:最好避免将数字值作为ids。用绳子。
Stack Overflow用户
发布于 2013-09-27 06:43:37
数据-在浏览器不支持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>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/19043930
复制相关文章
相似问题
腾讯云开发者
