使用jQuery向同一类的所有按钮添加事件

Question

这可能很容易，但我已经搜索了 SO 并为此尝试了一些建议，但没有一个可行。我正在使用一个 MVC 编辑器模板，它有一个带有标准 html 按钮和其他字段的 div。当我将一个集合传递给模板时，它将使用唯一的 ID 呈现集合中每个项目的字段。然后我想在单击任何按钮时打开一个对话框。按钮在编辑器模板中呈现如下：

@model ProductViewModel
<span>
    <button id="btnSelectTags-@(ViewData.TemplateInfo.HtmlFieldPrefix)" class="sig-button ie-shadowed select-tag" type="button" title="Select tags..." style="margin-right: 10px">Select tags</button>
</span>
// other fields

因此，如果我将一个包含 2 个对象的集合传递给编辑器模板，我会得到以下 html：

<button title="Select tags..." class="sig-button ie-shadowed select-tag" id="btnSelectTags-Products[0]" style="margin-right: 10px;" type="button">
// other fields then next item:
<button title="Select tags..." class="sig-button ie-shadowed select-tag" id="btnSelectTags-Products[1]" style="margin-right: 10px;" type="button">

这看起来不错，并为每个按钮提供了唯一的 ID。他们需要有一个唯一的 id（我认为），因为每个 div 中的项目都可以有自己的一组标签。因此，我想使用此 jQuery 向每个将打开对话框的按钮添加一个单击事件（我也尝试在选择器中包含其他类并尝试不使用“按钮”）：

if ($("button.select-tag")) {
    $(".select-tag").click(function () {
        showTagDialogBox();
    });
}

这是标签被渲染的 div：

<div style="display: none">
    <div id="tagDialogBox" title="Add Tags">
        @Html.EditorFor(x => x.ProductViewModels)
    </div>
</div>

这是 showTagDialogBox 函数：

function showTagDialogBox() {
    $('#tagDialogBox').dialog({
        autoOpen: false,
        title: "Select Tags",
        modal: true,
        height: 530,
        width: 700,
        buttons: {
            "Save": function () {
                $(this).dialog("close");
            },
            "Cancel": function () {
                $(this).dialog("close");
            }
        }
    });

    return false;
}

但是，当我单击任何按钮时，什么都没有发生 - 在 Firebug 中我也没有收到任何 js 错误。谁能发现我可能做错了什么？这是我正在尝试做的事情的图片：

Answer 1

好的，明白了 - 我有

自动打开：假

而它应该被设置为true。

*拍拍额头*