Question

我有使用jquery创建按钮和div的代码，该按钮可以切换div。如何切换n个div而不必为每个按钮和div创建代码（猜测创建的数量），就像我现在得到的那样：

<script>
  $("#place").on("click", "#odkat", function() {
    $(this).next( "#odbr" ).toggleClass( "odbro" );
  });
  $("#place").on("click", "#odkat_1", function() {
    $(this).next( "#odbr_1" ).toggleClass( "odbro" );
  });
  $("#place").on("click", "#odkat_2", function() {
    $(this).next( "#odbr_2" ).toggleClass( "odbro" );
  });
  $("#place").on("click", "#odkat_3", function() {
    $(this).next( "#odbr_3" ).toggleClass( "odbro" );
  });
  $("#place").on("click", "#odkat_4", function() {
    $(this).next( "#odbr_4" ).toggleClass( "odbro" );
  });
</script>

谢谢

Answer 1

您可以在此处使用 attribute starts with 选择器：

$("#place").on("click", "[id^='odkat']", function() {
    $(this).next().toggleClass( "odbro" );
});

Answer 2

解决方案是使用类而不是像

这样的ID

$("#place").on("click", ".odkat", function() {
   $(this).next().toggleClass( "odbro" );
});

将类odkat添加到ID为odkat*

的元素

点击为n <div>元素</div>的toggleClass

2 个答案: