Jquery Dialog没有处理图像点击

时间:2017-03-26 10:59:30

标签: jquery angularjs asp.net-mvc

工作流: 将JSON传递到角度范围,并使用视图中的file upload显示它。

使用以下功能显示单击特定类元素的对话框。

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> &amp;会出现Opener弹出窗口但不会点击具有相同类别的Opener11(在ng-repeat内)。

有人可以告诉我,我是否遗漏了什么?

1 个答案:

答案 0 :(得分:1)

改为使用:

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

您正在使用DOM上没有的元素注册事件,同时触发文档就绪事件。

参考问题: Event binding on dynamically created elements?