Blockui 正在分离事件

发布于 2024-12-14 04:00:24 字数 613 浏览 3 评论 0原文

我正在使用 block ui 来阻止页面并捕获一些信息：

在消息 div 上，我有 2 个按钮。确定并取消。

如果我在页面加载时设置点击事件：

$('#title-picker input[name=ok]').click(ok);
$('#title-picker input[name=cancel]').click(cancel);

调用 $.blockUI 后不会触发事件。但是，如果我使用 .live 方法，它就会按预期工作。

$('#title-picker input[name=ok]').live('click',ok);
$('#title-picker input[name=cancel]').live('click',cancel);

我假设它使用的机制会删除 div 并将其添加到 DOM，这一定是分离原始事件处理程序的原因。我之前使用过早期版本的 block ui，但它没有做到这一点。我在文档中看不到任何明显的内容。

那么，我的推理正确吗？

使用 .live 是否有任何缺点，即是否有更好的解决方法来解决我上面的问题？

原文

I am using block ui to block the page and capture some information:

On the message div, I have 2 buttons. OK and Cancel.

If I set the click events on the page load:

$('#title-picker input[name=ok]').click(ok);
$('#title-picker input[name=cancel]').click(cancel);

The events are not triggered after calling $.blockUI. However if I use the .live method instead it works as intended.

$('#title-picker input[name=ok]').live('click',ok);
$('#title-picker input[name=cancel]').live('click',cancel);

I assume the mechanism it uses removes and adds the div to the DOM, and this must be what is detaching the original event handlers. I've used earlier versions of block ui before and it hasn't done this. And I can't see anything obvious in the documentation.

So, is my reasoning correct?

And are there any downsides to using .live, i.e. is there a better workaround to what I have above?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

如果没有你 2024-12-21 04:00:24

您可以使用委托而不是实时

$('#title-picker').delegate('input', 'click', function(){
  if (this.name == 'ok') {
    ok();
  } else {
    cancel();
  }
//or even:  

  // window[this.name]();

  //if needed use the scope where your functions are defined 
  //instead of the window element
});

p.s.：在文档中提到：

BlockUI 插件版本 2 发生了哪些变化？
 解锁时元素不再从 DOM 中移除

you can use delegate instead of live

$('#title-picker').delegate('input', 'click', function(){
  if (this.name == 'ok') {
    ok();
  } else {
    cancel();
  }
//or even:  

  // window[this.name]();

  //if needed use the scope where your functions are defined 
  //instead of the window element
});

p.s.: in documentation is mentioned that :