Heck's Blog

今天有个同事遇到一个问题，就是用jquerr提交表单时出现问题，提交没反应，非要把按钮类型改成submit的才行，后来发现他的button的id写在submit，在jquery中用这些如submit, length, or method，是会产生冲突可能会导致混乱。

下面是大概的代码

<form id="fm1" action="http://www.heck.tk" method="post">
<h2>请输入您的用户名和密码.</h2>
<div><label for="username">用户名:</label> <input id="username" name="username" type="text" value="" /></div>
<div><label for="password">密码:</label> <input id="password" name="password" type="password" value="" /></div>
<div><label for="custom">自定义:</label> <input id="afterwardsVerify" name="afterwardsVerify" type="text" value="" /></div>
<div><input id="warn" name="warn" value="true" type="checkbox" /> <label for="warn">转向其他站点前提示我。</label></div>
<div>
    <input name="submit" value="提交" type="button" onclick="attachedsign() />
</div>
</form>



function attachedsign()
{
    var path = "/casPortal/login";
  
  $("#fm1).submit();
  }

上面代码看似没问题，但是就是提交不了。于是上jQuery API查找原因：

Additional Notes:
Forms and their child elements should not use input names or ids that conflict with properties of a form, such as submit, length, or method. Name conflicts can cause confusing failures. For a complete list of rules and to check your markup for these problems, see DOMLint.
翻译过来就是

其他注意事项：
表单和其子元素不宜用一个表单的属性的属性作为name或id的名称，如submit, length, or method，是会产生冲突。名称冲突可能会导致混乱的失败。对于一个完整的规则列表，并检查这些问题标记。

于是上jquery API查找原因，看到以下这段文字顿时明白了：

原来就是这个name=”submit”或者id="submit"的原因.........


来源：Heck's Blog
地址：https://www.heckjj.com/post/466/
转载时须以链接形式注明作者和原始出处及本声明，否则将追究法律责任，谢谢配合！