Question

我正在尝试拦截网页上特定表单的所有表单提交。使用jQuery看起来非常简单：form.submit(function(e) {…})如果单击提交按钮，它会很好用。

然而，选择字段上还有一个onChange属性this.form.submit()，看起来这个调用会绕过我的监听器（在Chromium / Firefox中）：

<script type="text/javascript">
    function submitForm(e) {
        window.alert('submitted');
        e.preventDefault();
        return false;
    }

    $(document).ready(function() {
        $('#bar').submit(submitForm);
    });
</script>

<form id="bar">
    <select name="name" onChange="this.form.submit()">
        <option>Foo</option>
        <option>Bar</option>
    </select>
    <br/>
    <input type="submit"/>
</form>

显然，在上面的代码中，我可以将this.form.submit()更改为我的提交侦听器的特定引用。然而，在我真正的应用程序中，它并不那么简单，所以我正在寻找无需修改onChange属性的方法。

如果我没有犯一个愚蠢的错误，但这实际上是预期的浏览器行为，如果你能解释事件流程以及为什么会导致上述症状，我会很高兴。

Answer 1

调用form.submit()方法不会触发submit事件，例如设置文本框的value不会触发其change事件。尝试通过jQuery触发submit事件：

<form id="bar">
    <select name="name" onChange="$('#bar').submit();">
        <option>Foo</option>
        <option>Bar</option>
    </select>
    <br/>
    <input type="submit"/>
</form>

根据documentation，表单上的默认submit操作将被触发，表单将被提交。

如何拦截表格可靠地提交？

1 个答案: