模型对话框和调用函数之间的链接答案

【问题标题】：link between model dialog and caller function模型对话框和调用函数之间的链接
【发布时间】：2012-04-28 13:14:06
【问题描述】：

我有一个图像列表和每个图像附加的删除按钮。

在单击删除按钮时，我在 jquery 事件处理程序的帮助下使用 twitter 引导模式打开了一个弹出窗口以进行确认。

现在当我点击弹出窗口中的确认按钮时，如何将值返回给调用函数（删除按钮），以便我可以从 dom 中删除图像？

Twitter 引导模式：http://twitter.github.com/bootstrap/javascript.html#modals

以下是我用来调用模型对话框的代码：

$('.close-btn').click(function(e) {
    e.preventDefault();
    $('#myModal').modal('show');
    //$(this).parents('li').remove();
});

【问题讨论】：

弹出是指新窗口还是模式对话框？我可能不得不改变我的答案。
我的意思是一个模态对话框，用 html 创建，并在 javascript 的帮助下调用。
请参阅 Twitter Bootstrap 模式，我在我的问题中提到过。
那我下面的回答是正确的

标签： jquery twitter-bootstrap

【解决方案1】：

模态框和其中的所有元素（表单字段、按钮、图片）已经是 dom 的一部分。您只需要为删除按钮处理提交、单击或任何您想要的事件。无需传递任何内容，因为模式已经是当前页面的一部分。

$('.close-btn').click(function(e) {
    e.preventDefault();
    $('#myModal').modal('show');
    //$(this).parents('li').remove();
});

$('#confirmDeleteButton').click(function() {
    //code here to delete the associated picture
}

【讨论】：

谢谢Pete，但我有多个删除按钮和一个确认对话框，当我点击“confirmDeleteButton”时，如何确定点击了哪个删除按钮。
有不同的方法。您可以为每个按钮动态分配一个唯一的 ID。使用 jQuery data() 是另一种选择，也是我将使用的。请参阅我的question here，这与您尝试执行的操作相同，只是我正在进行额外处理，而不是删除。

【解决方案2】：

我不确定这是否是正确的写法，但它对我有用：

        $('.close-btn').click(function(e) {
            e.preventDefault();
            e.stopPropagation()
            $('#myModal').modal('show');
            var elm = $(this).parents('li');
            $('.confirm-delete').click(function(e) {
                e.preventDefault();
                $(elm).remove();
                $('#myModal').modal('hide')
            })
        });

【讨论】：