javascript - 如何从一个按钮/一个 href 链接调用多个 onclick 事件？

Question

我有以下代码：

<input id="unassignButton" class="unassignButton" type="button" value="[[Unassign]]" onclick="javscript:unassignImage({$file.sid},{$listing_sid});"/>

在最终代码中，可能会生成多个类似的输入{$file.sid},{$listing_sid}

所以我可以有，例如：

<input class="unassignButton" type="button" value="Unassign" onclick="javscript:unassignImage(1533,185);">
<input class="unassignButton" type="button" value="Unassign" onclick="javscript:unassignImage(1558,290);">

现在我想创建一个链接，该链接将javscript:unassignImage一一调用所有具有 unassignButton ID 的输入的“onclick”函数，并考虑适当的参数unassignImage(1558,290)...

我怎样才能做到这一点？

提前致谢， 方舟

Answer 1

$("#unassignAll").on('click', function () {
    $(".unassignButton").trigger('click');
});

这将同时调用click绑定到所有取消分配按钮的回调。

Answer 2

您最好在 javascript 中分配点击处理程序而不是标记。另外 - 确保不要为每个按钮提供相同的 id unassignButton，因为 id 应该始终是唯一的，而类可以共享：

带有数据属性的标记：

<input id="{someUniqueId}" class="unassignButton" type="button" value="[[Unassign]]" data-fileSid="{$file.sid}" data-listingSid="{$listing_sid}"/>

的JavaScript：

$(document).ready(function(){
    // bind click handler to each button using the data attributes above
    $('input.unassignButton').on('click', function(){
        unassignImage($(this).data('fileSid'),$(this).data('listingSid'));
    });

    // bind click handler to 'unassignAll' button/link (assumes you have a button with class 'unassignAll'
    $('input.unassignAll').on('click', function(){
        $('input.unassignButton').trigger('click');
    });
});

有关数据属性的更多信息，请参阅.data() 上的 Jquery 文档