Question

我有点担心Firefox，jQuery或两者兼而有之。操作系统是Windows 7，Firefox是4.0.1版，jQuery介于1.5 - 1.6之间。

基本上我有一个带有button元素的表单，通过jQuery附加了一个click事件，删除了该按钮最接近的父div。这一切都很有效。

现在，当您尝试在执行上述操作后提交表单时，问题就出现了。 Chrome，IE，Opera和Safari提交表单。另一方面，Firefox拒绝提交表格。

我甚至在Firebug中尝试$("form").submit();无济于事。

Here is a test on jsFiddle，只需点击-按钮，然后点击Firefox中的submit即可查看我的意思。

非常感谢任何有关此事的帮助！

修改：我需要能够通过附加到form元素外按钮的Javascript / jQuery事件提交表单。

Answer 1

我想我已经找到了解决这个问题的最终解决方案。我花了最近几天在这个奇怪的行为中挣扎，终于来到这个线程和this one这对我帮助很大.. =））

button元素的“type”属性在几乎所有浏览器中都是is set by default to 'submit'（IE除外）。

问题似乎与我们在处理提交事件时删除节点并因此破坏表单的提交事件有关...

因此，将button =“button”添加到按钮元素实际上将解决此问题。

Here is a workign jsFiddle example.

Answer 2

我不知道为什么就是这种情况，但如果你更换：

<button name="test">-</button>

使用：

<input type="button" value="-" name="test" />

并使用$("input[name=test]")代替$("button[name=test]")，然后它似乎有效。

您可以在this fiddle中看到这一点。

Answer 3

尝试使用此代码：

<input type="submit" value="submit" />

如果你把它放在标签之前，它会自动提交表格。

<!DOCTYPE html>
<head>
    <title>Firefox/jQuery Submit Bug?</title>
</head>
<body>
    <form method="post" action="index.php" id="fform">
        <div>
            <input type="text" name="foo" value="bar" />
            <button name="test">-</button>
        </div>
    <input type="submit" value="submit" />
    </form>
</body>

Answer 4

“paic citron”的答案是正确的，但是，由于您通过Ajax进行“POST”，您可以替换此按钮：

<button name="test">-</button>

带有超链接和一些css：

<a href="#" class="bnt btn-warning" name="test">
   <i class="icon-remove icon-white"></i>
</a>

Here the jsFiddle that works

如果使用.remove（），表单将不会提交？

4 个答案: