Question

我刚刚遇到jQuery表单提交问题。我试图在按钮点击时使用jQuery ajax验证重复的表单字段。

如果用户是重复显示消息，则触发表单提交功能。

这是我的代码：

 <form method="post" action="mysite/action" id="signinform" name="signinform">
    <input type="text" tabindex="7" name="user_name" style="width: 100%" maxlength="255"    id="user_name" class="required" value="<?php echo $user_name ?>" />
    <em></em>
    <button type="button" onclick="is_duplicate_user()" class="button-big" name="submit">Continue</button>
  </form>
<script type="text/javascript">
function is_duplicate_user() {
    $('em').html('');
    $.ajax({
        type: 'POST',
        url: 'signin/is_user_exist',
        async: false,
        data: {'user_name': $('#user_name').val()},
        success: function(data) {
            if (data !== 'FALSE') {
                $('em').html(data);
                return false;
            } else {
                console.log('trigger submit event');
                $('#signinform').trigger('submit');
            }
        }
    });
}
</script>

如果data!=='FALSE'为真，则使用ajax返回数据设置em，否则显示控制台消息，但提交功能未触发。

然后我将按钮名称name="submit"更改为name="continue_button"。它开始工作。

请您告诉我为什么它不适用于name="submit"。

Answer 1

在附加说明中查看jQuery文档：http://api.jquery.com/submit/

表单及其子元素不应使用与表单属性冲突的输入名称或ID，例如submit，length或method。名称冲突可能导致混乱的故障。有关规则的完整列表以及检查这些问题的标记，请参阅DOMLint。

name="submit"按钮实际上覆盖了默认的jQuery submit()方法。

Answer 2

来自JQuery文档：

表单及其子元素不应使用与表单属性冲突的输入名称或ID，例如submit，length或method。名称冲突可能导致混乱的故障。有关规则的完整列表以及检查这些问题的标记，请参阅DOMLint。

检查出来：

http://forum.jquery.com/topic/submiting-a-form-programmatically-not-working

带名称的按钮提交停止触发表单的提交事件？

2 个答案: