Jquery对话框不处理图像单击

工作流程： 将JSON传递给angular作用域，并在视图中使用ng repeat来显示它

使用以下函数在单击特定类的元素时显示对话框

 $(function () {
        $("#dialog").dialog({
            autoOpen: false,
            show: {
                effect: "blind",
                duration: 1000
            },
            hide: {
                effect: "explode",
                duration: 1000
            }
        });

        $(".opener").on("click", function () {
            $("#dialog").dialog("open");
        });
    });

    $(function () {
        $("#imagePopup").dialog({
            autoOpen: false,
            show: {
                effect: "blind",
                duration: 1000
            },
            hide: {
                effect: "explode",
                duration: 1000
            }
        });

  <tr ng-repeat="item in ItemList| filter:itemName ">
            @*<td>
                {{ item.CreatorID}}
            </td>*@
            <td >
                {{item.ItemName}}
            </td>
            <td >
                {{item.CreatorName}}
            </td>
            <td >
                {{item.Length}}
            </td>
            <td >
                {{item.Width}}
            </td>
            <td >
                {{item.Price}}
            </td>
            <td >
                {{item.ItemDescription}}
            </td>
            <td >
                {{item.Quantity}}
            </td>
            <td >
                <div class="opener" style="text-align:center">
                    <img ng-src="@Url.Content("{{item.ImagePath}}")" width="60" height="60" class="img-responsive img-circle" />
                </div>
             </td>
            <td >
                 <span class="glyphicon glyphicon-pencil"></span>
            </td>
            <td >
                <span class="glyphicon glyphicon-trash"></span>
            </td>   

        </tr>

    </table>
    <button class="opener">Opener</button>
    <button class="opener">Opener11</button>

    <div id="dialog" title="Item Image">
        <p>Sample text</p>            
    </div>

希望在单击特定类时触发它

 $(function () {
        $("#dialog").dialog({
            autoOpen: false,
            show: {
                effect: "blind",
                duration: 1000
            },
            hide: {
                effect: "explode",
                duration: 1000
            }
        });

        $(".opener").on("click", function () {
            $("#dialog").dialog("open");
        });
    });

    $(function () {
        $("#imagePopup").dialog({
            autoOpen: false,
            show: {
                effect: "blind",
                duration: 1000
            },
            hide: {
                effect: "explode",
                duration: 1000
            }
        });

  <tr ng-repeat="item in ItemList| filter:itemName ">
            @*<td>
                {{ item.CreatorID}}
            </td>*@
            <td >
                {{item.ItemName}}
            </td>
            <td >
                {{item.CreatorName}}
            </td>
            <td >
                {{item.Length}}
            </td>
            <td >
                {{item.Width}}
            </td>
            <td >
                {{item.Price}}
            </td>
            <td >
                {{item.ItemDescription}}
            </td>
            <td >
                {{item.Quantity}}
            </td>
            <td >
                <div class="opener" style="text-align:center">
                    <img ng-src="@Url.Content("{{item.ImagePath}}")" width="60" height="60" class="img-responsive img-circle" />
                </div>
             </td>
            <td >
                 <span class="glyphicon glyphicon-pencil"></span>
            </td>
            <td >
                <span class="glyphicon glyphicon-trash"></span>
            </td>   

        </tr>

    </table>
    <button class="opener">Opener</button>
    <button class="opener">Opener11</button>

    <div id="dialog" title="Item Image">
        <p>Sample text</p>            
    </div>

在这里，当我点击按钮开启器和开启器11时，弹出窗口出现，但点击时没有出现相同的分类重复

有人能告诉我我是否遗漏了什么吗？

请改用：

$(document).on("click", ".opener", function () {
       $("#dialog").dialog("open");
});

在触发document ready事件时，您正在向DOM上不存在的元素注册事件

参考问题：

---

页面呈现后是否动态添加项目？-在这种情况下，你需要事件授权谢谢，你能分享一个链接吗？这里有详细的解释。？