Question

我有一个页面可能有30个左右的id。我想打开/关闭它们，而不必再写下28次。我该怎么做？

第一个：

$(document).ready(function(){
    $("#one").hide();
    $("#hide1").click(function(){
        $("#one").slideToggle(2000);
    });
});

第二个：

$(document).ready(function(){
    $("#two").hide();
    $("#hide2").click(function(){
        $("#two").slideToggle(2000);
    });
});

将id更改为＃toggle1然后使用starts-with选择器^ =或类似内容会更有意义吗？

Answer 1

我会推荐这个标记：

<!-- The element to click -->
<button id="one" class="button">Button</button>

<!-- The element to toggle -->
<div class="target-button" data-trigger="one">...</div>

的jQuery

// Attach an event listener for .button class
$(document).on('click', '.button', function() {
   // Find the .target-button element
   // that has a 'data-trigger' attribute value equal to the clicked element's id
   $('.target-button[data-trigger="' + $(this).attr('id') + '"]').slideToggle(2000);
});

注意

this返回点击的元素（javascript DOM元素）。

$(this)只是this
的jQuery对象

如何多次使用jQuery切换功能

1 个答案: