jquery - 如何组合具有连续 ID 的元素的函数

Question

抱歉，如果标题令人困惑，我想不出更好的东西。基本上，我想做的事情很简单。这是我的代码

jQUery('.button1').click(function() {
    jQuery(".box1").slideUp();
    jQuery(this).remove();
});
jQUery('.button2').click(function() {
    jQuery(".box2").slideUp();
    jQuery(this).remove();
});
jQUery('.button3').click(function() {
    jQuery(".box3").slideUp();
    jQuery(this).remove();
});

等等......现在，当我有更多盒子时，情况就变得一团糟。有什么方法可以将它们全部组合起来并让 jquery 执行 ID 号吗？

Answer 1

您可以设置按钮的类名(例如“buttons”)并使用ID:

<button id="button1" class="buttons">Delete</button>

然后，您可以使用一些技巧来从 ID 中获取数字:

$(".buttons").on("click", function() {
    var n = this.id.replace("button", "");
    $(".box" + n).slideUp();
    $(this).remove();
});

演示: http://jsfiddle.net/DXzKu/