将 jQuery .live 与切换事件一起使用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2172614/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Using jQuery .live with toggle event
提问by Dave Kiss
My code is working, but requiring me to click twice to active my chaining (once for the click event, and once for the toggle event.) What can I do to make it so I only have to click once so that the toggle will automatically occur?
我的代码正在运行，但需要我单击两次以激活我的链接（一次用于单击事件，一次用于切换事件。）我该怎么做才能做到这一点，所以我只需要单击一次，切换就会自动发生？
//Show or Hide Comments
$('#showHideComments').live('click', function() {
$('#showHideComments').toggle(function() {
$(".commentsSwitch").animate({"marginLeft": "+=53px"}, 500);
$("#comments").fadeIn(300);
$("#addComment").fadeIn(300);
},function(){
$(".commentsSwitch").animate({"marginLeft": "-=53px"}, 500);
$("#comments").fadeOut(300);
$("#addComment").fadeOut(300);
});
});
Thanks!
谢谢！
回答by Doug Neiner
You cannot use liveand toggletogether. What you can do, is simply make your own "toggle" of sorts:
不能live和和toggle一起使用。你可以做的，只是让你自己的“切换”种类：
$('#showHideComments').live('click', function() {
if($("#addComment").is(':visible')){
$(".commentsSwitch").animate({"marginLeft": "-=53px"}, 500);
$("#comments, #addComment").fadeOut(300);
} else {
$(".commentsSwitch").animate({"marginLeft": "+=53px"}, 500);
$("#comments, #addComment").fadeIn(300);
};
});
liveis binding to click, however, when toggleis called, it is also bound (normally) on click. You should decide if 'live' is really what you need. For instance, if #showHideCommentsobject is replaced via AJAX during the use of the page, then you need live and my solution. However, if it isn't swapped out and remains the same, just use the inside of your original livefunction (just the toggle code) and you will be golden.
live绑定到click，但是，当toggle被调用时，它也会（通常）在点击时绑定。您应该决定“活”是否真的是您所需要的。比如#showHideComments在页面使用过程中通过AJAX替换对象，那么你就需要live和我的解决方案。但是，如果它没有被换出并保持不变，只需使用原始live函数的内部（仅切换代码），您将获得成功。
回答by David M.
//Show or Hide Comments
$('#showHideComments').live('click', function() {
$('#showHideComments').toggle(function() {
$(".commentsSwitch").animate({"marginLeft": "+=53px"}, 500);
$("#comments").fadeIn(300);
$("#addComment").fadeIn(300);
},function(){
$(".commentsSwitch").animate({"marginLeft": "-=53px"}, 500);
$("#comments").fadeOut(300);
$("#addComment").fadeOut(300);
}).trigger('click');
});
This will also work :)
这也将起作用:)
回答by Dylan Glockler
Better yet, use $(this) for the toggle so it refers to the parent - this will work better with multiple instances based on classes or unique objects referred by ID at the parent:
更好的是，使用 $(this) 进行切换，以便它引用父级 - 这将更好地用于基于类或父级 ID 引用的唯一对象的多个实例：
$('#showHideComments').live('click', function() {
$(this).toggle(function() {
$(".commentsSwitch").animate({"marginLeft": "+=53px"}, 500);
$("#comments").fadeIn(300);
$("#addComment").fadeIn(300);
},function(){
$(".commentsSwitch").animate({"marginLeft": "-=53px"}, 500);
$("#comments").fadeOut(300);
$("#addComment").fadeOut(300);
}).trigger('click');
});
回答by Developer
liveis deprecated. Use oninstead
For instance:
live已弃用。改用on例如：
$(document).on 'click', 'a[data-object="save-post"]', () ->
alert 'Saving the post...'
