用户定义的回调函数在Javascript/jQuery中被多次触发
User-defined callback function is being fired multiple times in Javascript/jQuery
还有一些类似的问题,但它们似乎都是关于本机jQuery回调函数的。
因此,我有了这段代码,它(live)创建了一个包含一些表单元素的div。在移除div之前,应该在回调函数中检索这些元素的值。
function popup(callback) {
// ...
// before removing the div
callback.call();
// remove div
}
出乎意料的是,在执行第一次弹出后,回调函数被多次(越来越多)触发。
我已经简化了代码,下面是小提琴。
我希望这正是您所需要的。
function popup(callback) {
$("body").append('<div><span id="test">test</span> <a href="#" id="close">close</a></div>');
$(document).on("click", "#close", function() {
callback.call();
//
//callback = function() {};
$(document).off("click", "#close");
$("div").remove();
});
};
$(document).on("click", "#open", function() {
popup(function() {
alert('$("#test").length = ' + $("#test").length);
});
});
基本上,您需要通过调用off()方法来移除事件处理程序。
尝试动态生成元素,而不是使用字符串。这将使您能够更轻松地绑定事件。
function popup(callback)
{ var $elem = $("<div></div>");
$elem.append($("<span></span>").html("test"));
$elem.append(" ");
$elem.append($("<a></a>").html("close").attr("href", "#"));
$("body").append($elem);
$elem.find("a").click(function() {
callback.call();
$elem.remove();
});
};
$(document).on("click", "#open", function() {
popup(function() {
alert('$("#test").length = ' + $("#test").length);
});
});
示例:http://jsfiddle.net/4se7M/2/
我不知道确切的场景,但为什么每次显示弹出窗口时都要绑定和取消绑定事件?
你只能绑一次,像这样,不是吗?
$(document).on("click", "#close", function() {
alert('$("#test").length = ' + $("#test").length);
$("div").remove();
});
function popup() {
$("body").append('<div><span id="test">test</span> <a href="#" id="close">close</a></div>');
};
$(document).on("click", "#open", function() {
popup();
});
相关文章:
- jQuery自定义验证比较多个输入的序列
- 如何在JQuery函数中定义一个值,然后调用另一个函数并使用该值
- 是否有任何方法可以使用jQuery替换在数组中定义值的文本
- Jquery未定义函数正在停止其他操作
- jQuery工具验证器自定义效果-添加&消除影响
- Wordpress中带有JQuery Accordion的未定义匿名函数
- 如何在WordPress的头中加载自定义jQuery
- 用户在noConflict mod中使用jQuery定义函数
- PHP/JQUERY定义包含的页面
- 如何在 js 中调用使用 jquery 定义的函数
- Jquery定义了一个$(this)变量,以便在许多函数中重用
- 如何使用JQuery定义Twitter推文的宽度
- 使用jQuery定义onInput事件创建元素
- 如何在新选项卡中打开jquery定义的链接
- 使用JQuery定义的Typescript和文件上传
- 使用jQuery定义带连字符的属性
- 使用JavaScript或jQuery定义全局CSS类
- 使用jquery定义如何在基于网格的数据表插件中添加自定义链接按钮
- 在用jQuery定义的元素上运行JavaScript函数
- clearInterval 和 jQuery..定义!+ 小提琴