javascript - 如何使按钮列表监听来自不同元素的事件

Question

我有一个网页，其中包含数量可变的“从属”按钮，这些按钮应该在单击“主”按钮时监听。见下图:

我想使用 jQuery 连接事件，这样当单击“主”按钮时，就会为每个“从”按钮调用一个 JavaScript 函数。我希望每个单独的“从属”按钮都能监听“主”按钮触发的事件。每个“从属”按钮的类属性都设置为 class="btn btn-default SlaveButton"，其中我可以使用类“slaveButton”通过 jQuery 的类选择器获取所有“从属”按钮。由于“从属”按钮的数量是可变的，我不确定如何在 JavaScript 中进行设置，最好有一个示例。

每个“从属”按钮都有一个 HTML5 数据属性，其在列表中的索引(即 1、2、3、4)我将传递到 ajax 请求中。

Answer 1

在我看来，您已经知道该怎么做了。

//wire up event listener for master button
$("#master-button").click(function() {
    //your master button was clicked.
    //loop over all the slave buttons
    $(".slaveButton").each(function( index, btnElement) {
        //index shows the place of the slaveButton in the list/dom
        console.log("your button element is", this, "and was triggered when" , $("#master-button").get(0) , "was clicked);
    });
});