2

我最近开始使用 jQuery，遇到了一个我无法理解的场景。我对前端编程还很陌生，仍在学习。

我有一个包含两个必需输入文本字段的表单。
我有一个 div，里面什么都没有。
我有 3 个重置按钮（Reset1、Reset2 和 Reset3）。

Reset1 - 单击时，更改操作后提交表单并绕过所有 html 验证。
Reset2 - 单击时，在 div 中添加名称和 id 作为提交的隐藏元素，然后在更改操作后提交表单。这不会绕过 html 验证。
Reset3 - 单击时，在 div 中添加一个名为submit1的隐藏元素并提交表单。这绕过了所有的 html 验证

因此，当我尝试添加名称和 ID 为"submit"的隐藏元素时，我无法找到为什么没有绕过 html 验证。

如果我添加任何其他名称与提交不同的隐藏元素，则它会绕过所有 html 验证。

代码如下：JsFiddle - http://jsfiddle.net/sumitk1/pRY4u/

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript">
    $(document).ready(function(){

        $('#reset1').button().click(function(){
            // The below line submits the form without validation check
            $("#myForm").attr("action", "test1.html").submit();
        });
        $("#reset2").button().click(function(){
            // The below 2 line always wait for validation check
            $("#hiddenDiv").append('<input type="hidden" name="submit" id="submit" value="reset"/>');
            $("#myForm").attr("action", "test2.html").submit();
        });
        $("#reset3").button().click(function(){
            // The below 2 line always wait for validation check
            $("#hiddenDiv").append('<input type="hidden" name="submit1" id="submit1" value="reset"/>');
            $("#myForm").attr("action", "test3.html").submit();
        });

    });
</script>


</head>
<body>

<form id="myForm" name="myForm" action="some.html" method="post">

    <input id="textBox1" name="textBox1" type="text" required="required" title="text1"><br/>
    <input id="textBox2" name="textBox2" type="text" required="required" title="text2"><br/>

    <div id="hiddenDiv" name="hiddenDiv"></div>

    <input id="reset1" name="reset1" type="submit" value="Reset1">
    <input id="reset2" name="reset2" type="submit" value="Reset2">
    <input id="reset3" name="reset3" type="submit" value="Reset3">

</form>

</body>
</html>
4

0 回答 0