6

我正在尝试拦截网页上特定表单的所有类型的表单提交。使用 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 属性的方法。

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

4

1 回答 1

10

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

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

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

于 2010-10-18T09:08:20.920 回答