暂时禁止jQuery事件处理
暂时禁止jQuery事件处理
提问于 2009-11-27 23:07:55
有没有一种优雅的方法可以暂时抑制jQuery事件？我使用的代码如下：
$(element).unbind(event, function1).unbind(event, function2);
// code for which the event is suppressed
$(element).bind(event, function1).bind(event, function2);但我发现它有点笨拙，并且不能很好地扩展到许多事件。为什么我要暂时禁止事件？在Ajax访问期间，我使用BlockUI插件来阻止UI。这是通过BlockUI提出的：$().ajaxStart($.blockUI).ajaxStop($.unblockUI)来完成的。
但是，一次Ajax访问是特殊的，所以我需要一条不同的消息。ajaxStart和ajaxStop事件会干扰消息代码(不显示任何内容)：
function message(text, callback) {
if (text == undefined) {
$.unblockUI();
return;
}
// $().unbind('ajaxStop', $.unblockUI).unbind('ajaxStart', $.blockUI);
$("#message_text").html(text);
$.blockUI({message: $("#message")});
$("#message_ok").click(function() {
// $().bind('ajaxStop', $.unblockUI).bind('ajaxStart', $.blockUI);
$.unblockUI();
if (callback != undefined) callback();
});
}只有当我取消对unbind()和bind()行的注释时，它才能工作。
回答 6
Stack Overflow用户
回答已采纳
发布于 2012-05-23 23:19:29
我意识到这个问题很老了，但我在寻找相同问题的答案时发现了这个问题，并最终找到了一个不同的解决方案，它在简单的事件处理程序应用程序中工作得很好。
$(element).click(function(e) {
e.preventDefault();
// Check for fired class
if ($(this).hasClass('fired') == false) {
// Add fired class to all instances of element
$(element).addClass('fired');
// Do the rest of the function...
// Remove fired class to 'reactivate' events
$(element).removeClass('fired');
}
}当来自事件的代码被触发时，只需在‘元素中添加一个类，就可以防止进一步的代码因为另一个单击事件而被执行。因此，虽然你实际上没有阻止任何其他单击事件，但你正在阻止结果代码运行。简单粗暴地忽略了大量鼓吹的bind和unbind的使用，但却是有效的。
Stack Overflow用户
发布于 2009-11-28 04:27:24
花费我完成这个脚本，我希望它是有用的：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
//ini plugin
jQuery.event.freezeEvents = function(elem) {
if (typeof(jQuery._funcFreeze)=="undefined")
jQuery._funcFreeze = [];
if (typeof(jQuery._funcNull)=="undefined")
jQuery._funcNull = function(){ };
// don't do events on text and comment nodes
if ( elem.nodeType == 3 || elem.nodeType == 8 )
return;
var events = jQuery.data(elem, "events"), ret, index;
if ( events ) {
for ( var type in events )
{
if ( events[type] ) {
var namespaces = type.split(".");
type = namespaces.shift();
var namespace = RegExp("(^|\\.)" + namespaces.slice().sort().join(".*\\.") + "(\\.|$)");
for ( var handle in events[type] )
if ( namespace.test(events[type][handle].type) ){
if (events[type][handle] != jQuery._funcNull){
jQuery._funcFreeze["events_freeze_" + handle] = events[type][handle];
events[type][handle] = jQuery._funcNull;
}
}
}
}
}
}
jQuery.event.unFreezeEvents = function(elem) {
// don't do events on text and comment nodes
if ( elem.nodeType == 3 || elem.nodeType == 8 )
return;
var events = jQuery.data(elem, "events"), ret, index;
if ( events ) {
for ( var type in events )
{
if ( events[type] ) {
var namespaces = type.split(".");
type = namespaces.shift();
for ( var handle in events[type] )
if (events[type][handle]==jQuery._funcNull)
events[type][handle] = jQuery._funcFreeze["events_freeze_" + handle];
}
}
}
}
jQuery.fn.freezeEvents = function() {
return this.each(function(){
jQuery.event.freezeEvents(this);
});
};
jQuery.fn.unFreezeEvents = function() {
return this.each(function(){
jQuery.event.unFreezeEvents(this);
});
};
//end plugin
jQuery("#test1").ajaxStart(function test1(){
jQuery("#result").append('test1 ajaxStop<br>');
});
jQuery("#test1").ajaxStop(function test2(){
jQuery("#result").append('test1 click<br>');
});
jQuery("#test1").bind("click", function test3(){
jQuery("#result").append('test1 click<br>');
});
jQuery("#test2").bind("click", function test5(){
jQuery("#result").append('test2 click<br>');
});
jQuery("#freez").click(function(){
jQuery("#test1").freezeEvents();
jQuery("#test2").freezeEvents();
});
jQuery("#unfreez").click(function(){
jQuery("#test1").unFreezeEvents();
jQuery("#test2").unFreezeEvents();
});
});
</script>
</head>
<body>
<button id="freez">freez</button>
<button id="unfreez">un freez</button>
<br />
<div id="test1">test1 click mousemove</div>
<div id="test2">test2 click mousemove</div>
<br />
<div id="result"></div>
</body>
</html>Stack Overflow用户
发布于 2012-11-06 04:32:04
我真的很喜欢Andres解决这个问题的方法，但是自从他想出代码以来，jQuery事件模型已经改变了，所以在最近的jQuery版本中，他的代码不能工作。在这里，它是现代化的。在1.8.2中进行了(轻微)测试：
$.event.freezeEvents = function(elem) {
if (typeof($._funcFreeze)=="undefined") {
$._funcFreeze = [];
}
if (typeof($._funcNull)=="undefined") {
$._funcNull = function() {};
}
// don't do events on text and comment nodes
if ( elem.nodeType == 3 || elem.nodeType == 8 ) {
return;
}
var events = $._data(elem, "events");
if (events) {
$.each(events, function(type, definition) {
$.each(definition, function(index, event) {
if (event.handler != $._funcNull){
$._funcFreeze["events_freeze_" + event.guid] = event.handler;
event.handler = $._funcNull;
}
})
})
}
}
$.event.unFreezeEvents = function(elem) {
// don't do events on text and comment nodes
if ( elem.nodeType == 3 || elem.nodeType == 8 )
return;
var events = $._data(elem, "events");
if (events) {
$.each(events, function(type, definition) {
$.each(definition, function(index, event) {
if (event.handler == $._funcNull){
event.handler = $._funcFreeze["events_freeze_" + event.guid];
}
})
})
}
}
$.fn.freezeEvents = function() {
return this.each(function(){
$.event.freezeEvents(this);
});
};
$.fn.unFreezeEvents = function() {
return this.each(function(){
$.event.unFreezeEvents(this);
});
};除了有两个事件的元素之外，我还没有对此进行过测试，但它对我来说很好。希望这对某些人有帮助。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/1809275
复制相关文章
相似问题
腾讯云开发者
