Question

好吧，我知道这个头衔听起来可能会错过领先，但请耐心等待......

我使用以下代码，目的是重用几个节点来构建一个简单的是/否对话框：

var myDialog = function(e) {
    if(myDialog.dialog === undefined){
        var container = $('<div><h2>Are you sure you want to delete this Item?</h2></div>'),
            yesBtn = $('<input type="button" value="Yes" id="yesBtn"/>').appendTo(div),
            noBtn =  $('<input type="button" value="No" id="noBtn"/>').appendTo(div);

       myDialog.dialog = container; 
       $('#yesBtn').on({ click: function(e) { console.log('Yes'); } } );
       $('#noBtn').live('click', function(e) { console.log('No'); });
    }

    //I am using a third party lib called facebox to create the showbox
    $.facebox(myDialog.dialog);
};

然后这个函数被一个按钮使用，当点击它时，显示对话框（每次都正确），当第一次点击时，是/否按钮正确激发，但是当再次显示对话框时，没有这两件事发生了火灾。

如果我使用的，这个问题会得到解决，但我一直在读这个问题实践是开始使用后者而不是前者。

任何评论都会有很大的帮助！

提前致谢。

Answer 1

当你将选项哈希发送到on（）

时，我认为它不起作用

而不是

$('#yesBtn').on({ click: function(e) { console.log('Yes'); } } );

尝试

$('#yesBtn').on("click", function(e) { console.log('Yes'); }  );

Answer 2

这取决于您使用的jQuery版本。检查你的jQuery版本是什么。从jQuery 1.7开始，你应该使用on使用live不推荐使用。如果使用1.4，则无法使用on。

$(selector).live(events, data, handler);                // jQuery 1.3+
$(document).delegate(selector, events, data, handler);  // jQuery 1.4.3+
$(document).on(events, selector, data, handler);        // jQuery 1.7+

你也在以错误的方式使用on。

你传递了错误的参数。
您只能在on上的第三个参数上传入对象。您将其作为对象数据传递。
使用on表示您放置一个侦听器，然后等待该事件从您选择的DOM元素冒泡到该侦听器，因此，这是正确的方法：

$（document）.on（“click”，“＃themBtn”，function（e）{console.log（“Yes”）;}）;

在这种情况下，它会冒泡到document。您可能想要将事件冒泡到仅#yesBtn的容器。你可以在div或其他东西中包裹#yesBtn

与jQuery的on方法绑定的事件只触发一次

2 个答案: