提交按钮不会触发IE上的jQuery绑定提交事件

我对IE有问题（8，未在7上测试过）。我有一个很简单的情况：我建立表单元件提交按钮不会触发IE上的jQuery绑定提交事件

var formNode = $('<form>');

附上一群其他元件的形式（与输入元素字段集表的内部）。然后我的形式附加到DOM，然后绑定一个提交处理程序：

formNode.bind('submit', function (ev) { 
    alert('submit of form!'); 
    // do lots of stuff.... 
}

这适用于Safari浏览器在我的Mac（呀，我是Mac的家伙），以及Safari和Firefox在Windows上，但当我在使用IE 8时单击提交按钮时，从不会调用警报。相反，浏览器会尝试为/（我没有为表单设置一个Method或一个Action - 也许这是必要的？）提交GET请求。

任何见解都将不胜感激，因为我正在进行更改，以便进行调试。

来源

2010-09-24 Zhami

*“（我没有设置表单的方法或动作 - 也许这是必要的？）”*你试过了吗？ – 2010-09-24 14:08:47

你使用的是什么版本的jQuery？ – ahsteele 2010-09-24 21:15:09

我从Google的CDN中获取jQuery 1.4.2.min。孤立地说，我有简单的代码生成一个表单，我附上一个提交处理程序，所有工作正常。在我的应用程序中，它构建了很多DOM，简单的测试用例失败了，所以有一些互动...我试图隔离... – Zhami 2010-09-24 21:38:18

在Internet Explorer中使用jQuery从表单元素中侦听事件时存在各种各样的问题。在jQuery论坛上有一系列评论： IE-specific issues with live ('submit')。当然，我知道你使用的是bind而不是live，但是许多描述的问题涉及使用两者的尝试。

我评论你的答案，询问你正在使用哪个版本的jQuery。如果你还没有，可以这样做，我会升级到最新版本。

一些代码解决方案：

绑定提交处理到体元素
适应在上述jQuery的论坛讨论从synertech1答案的每一个孩子。

var submitHandler = function() { ... }; 

$("body").children().each(function() { 
     $("form", this).bind("submit", submitHandler); 
})

绑定到提交输入类型
我讨厌这个选项，因为表单元素是绑定到更合适的元件。

$('form > input[type*="submit"]').bind('click', function(event) { 
    var form = $(this).parent; 
    form.submit(); 
    event.preventDefault(); 
});

来源

2010-09-24 21:42:23 ahsteele

感谢您的链接和建议。我试图缩小这个问题的范围，因为我发现的是，如果我使用表单和提交按钮构建一个最小的HTML文件并绑定到该文件，IE就可以工作。所以我花了几个小时在应用程序中实例化一个表单和按钮，发现它在哪里工作...以及哪些地方没有，并且试图在分界线上磨合，这可能揭示它为什么在其中起作用一些案件而不是其他案件。我希望我不会无情地旋转我的轮子。 – Zhami 2010-09-25 14:18:48

@Zhami在你的测试中，你将事件绑定到哪个按钮或表单上？ **将提交处理程序绑定到body元素的每个子元素**的建议在那里，因为有人猜想事件绑定在文档级别的事件具有被IE损失的倾向。我会把它们绑在身上，看看会发生什么。 – ahsteele 2010-09-25 18:26:38

我绑定到窗体本身。我希望这样做，以便继续调查与萨米图书馆的“碰撞”，看看我能否找到有效的解决方法。 – Zhami 2010-09-28 13:39:58

你还没有说过你正在使用什么级别的HTML，但是FWIW，action是HTML4中form元素的必需属性。所以如果一个浏览器在没有它的情况下表现得很奇怪，那就不足为奇了。（在HTML5中，validator表示，它不需要任何更长的时间，可能是因为一些这方面的东西，现在允许在提交按钮本身。）

来源

2010-09-24 14:12:01

HTML 4.我试图在元素创建时设置action =“”，现在表单甚至不能在IE 8上渲染（适用于Mac Safari）。将继续尝试... – Zhami 2010-09-24 14:20:37

'action =“”'也是无效的。试试'action =“＃”'。但如果表格甚至没有提供，坦率地说，我怀疑其他地方存在更大的问题。 – 2010-09-24 14:27:19

好奇：如果我尝试在jQuery元素创建中设置action =“＃”，则不会创建元素，并且表单不会呈现;代码：formNode = $（'

你记住，从事件处理程序return false（或event.preventDefault()）？如果没有，表单将继续提交，有效地导航到action URL或与当前文档相同的URL（如果没有）。虽然真的应该有一些action为HTML有效性和尽可能提供一个工作的非JavaScript解决方案（逐步增强和所有）。

如果做有return false，确保没有JavaScript错误是在中止功能它得到return false前处理程序代码出现。打开Internet选项中的JS错误报告和/或使用调试器。

来源

2010-09-24 14:53:34 bobince

我希望我有需要停止传播的问题:-)但问题是提交处理程序甚至不执行。是的，代码返回false。现在进行测试，我在进入时发出警报 - 不会发生 - 然后返回false。 ...至于需要一个动作......我的用例是一个浏览器中的Javascript应用程序 - 服务器无法做到这一点，因为此表单的所有功能都是在处理程序中执行的。这适用于除IE以外我尝试过的所有浏览器。我的应用程序没有任何“渐进” - 如果Javascript不起作用，那么应用程序是DOA。 – Zhami 2010-09-24 15:08:33

提交按钮不会触发IE上的jQuery绑定提交事件

回答

相关问题