IE的非气泡提交事件的解决方法

时间:2008-12-11 21:41:34

标签: javascript ajax internet-explorer javascript-events

我正在开发一个包含大量AJAX的大型Web应用程序,其事件处理已失控。我正在尝试设置一个event delegation系统来管理所有这些系统,但我想知道IE的非冒泡表单提交是否有解决方法(有很多表单可以通过AJAX插入/更新)。我提出的最好的事情是每次从AJAX调用得到响应时执行一些javascript来重新加载提交处理程序,但这看起来很难看。有什么想法吗?

此外,是否有人能够很好地参考哪些事件在不同版本的IE中无法正确传播?我很难找到好的信息(尽管this other question有一点)。


网站的一个真实示例:对某些用户内容进行就地编辑。做事件委托,我会让身体听取提交事件,然后看看哪个元素触发了事件并相应地处理它。由于提交不会在IE中冒泡,这不起作用。 5美元的解决方案是为所有其他事件进行事件委托,并在Prototype中使用类似的方式处理提交:

// call this onload:
$$('form').invoke('observe', 'submit', function(event) { /*delegate*/ });

但这对于动态创建的表单不起作用(我必须每次都如上所述重新实例化处理程序),如果我可以“make”表单提交bubble,整个事情会更好在IE中,只是在任何地方进行普通授权(没有特殊情况等)。

6 个答案:

答案 0 :(得分:3)

你能否让表单返回false并只在提交按钮而不是表单提交事件上查找CLICK事件?然后通过AJAX调用以编程方式提交表单。

答案 1 :(得分:2)

Rails 3 rails.js通过检测浏览器是否支持提交事件冒泡来解决此问题,如果没有,则将onSubmit方法绑定到窗体的第一个焦点事件处理程序。非常整洁。

结帐

http://github.com/rails/rails/commit/f61d923d284062b4e4864d81c603157020198d06

答案 2 :(得分:1)

您可以尝试的一种技巧是只有两种形式:“工作”形式和隐藏的“提交”形式,并且页面上只有这两种形式。

“工作”表单是向用户显示的内容 - 它只是一个容器,可以包含各种形式的元素。表单上的各种按钮实际上并不提交,而是在JavaScript中调用表单处理程序/验证例程。

处理程序/验证例程动态设置“提交”表单的操作,并动态地将所需元素添加到该表单,以便可以提交。

通过这种方式,您永远不会添加和删除标签本身,只是改变了两个主要的外观和行为,从而避免了所有令人讨厌的事件操作。

答案 3 :(得分:1)

Matt Kantor, 我强烈建议您查看NWEvents。正如你所说,它实际上是在IE中强制冒泡,并以跨浏览器的方式为任何其他事件提供“事件委托”。

NWEvents源代码位于GitHub

答案 4 :(得分:1)

另一个需要考虑的选择可能是reglib

最新的trunk版本有一个允许委托提交的实现

答案 5 :(得分:0)

到目前为止我考虑的选项:

  • 我在问题中发布的糟糕解决方案。
  • The Inline Cop-out - 始终保证工作,并且开销相对较低,但令人难以置信的突兀。我必须调整这个想法来使用Prototype(这不会真的很难,我可能只是编写一个Event.fix(事件)函数来停止事件然后重新触发它以快乐的方式传播)。
  • NWEvents - 我没有机会过多地捣乱这一点,但据说这会迫使所有事件冒泡。查看源代码,我不确定这是否适用于动态创建的元素。我将不得不再玩它了。
豫ICP备18024241号-1