Question

我现在一直在寻找这个错误3个小时，而我无法找到它的生命。无论出于何种原因，似乎都没有调用onsubmit。我试图确保用户在每个字段中输入一个非负数

＆＃13;

<!DOCTYPE html>
<html>
<head>
        <script type="text/javascript">
        function validate(){
                var wid1 = document.getElementByName("widget1").value;
                var wid2 = document.getElementByName("widget2").value;
                var wid3 = document.getElementByName("widget3").value;
                if(isNaN(wid1)||isNaN(wid2)||isNaN(wid3)){
                        alert("all values entered must be numbers");
                        return false;
                }
                else if(wid1 < 0 || wid2 < 0 || wid3 < 0){
                        alert("all values must be greater than zero");
                        return false;
                }
                if(wid1+wid2+wid3 > 25){
                        if(!confirm("you have more than 25 items. Will you accept the additional shipping?")){
                                return false;
                        }
                }
                return true;
        }
        </script>
</head>
<body>
         <form name="order" action="calculations.php" method="get" onsubmit="return validate()">
                <p>37AX-L:</p>
                <input type="text" name="widget1" value="0" required/>
                <br>
                <p>42XR-J</p>
                <input type="text" name="widget2" value="0" required/>
                <br>
                <p>93XX-A</p>
                <input type="text" name="widget3" value="0" required/>
                <br>
                <input type="radio" name="State" value="MO" checked>Missouri</input>
                <br>
                <input type="radio" name="State" value="IL">Illinois</input>
                <br>
                <input type="submit" value="submit"/>
        </form>
</body>
</html>

＆＃13;

Answer 1

首先，函数的名称是getElementsByName - Elements是复数。

其次，由于这会返回NodeList，因此您需要索引结果以访问特定元素，以便您可以访问其值。

<!DOCTYPE html>
<html>
<head>
        <script type="text/javascript">
        function validate(){
                var wid1 = document.getElementsByName("widget1")[0].value;
                var wid2 = document.getElementsByName("widget2")[0].value;
                var wid3 = document.getElementsByName("widget3")[0].value;
                if(isNaN(wid1)||isNaN(wid2)||isNaN(wid3)){
                        alert("all values entered must be numbers");
                        return false;
                }
                else if(wid1 < 0 || wid2 < 0 || wid3 < 0){
                        alert("all values must be greater than zero");
                        return false;
                }
                if(wid1+wid2+wid3 > 25){
                        if(!confirm("you have more than 25 items. Will you accept the additional shipping?")){
                                return false;
                        }
                }
                return true;
        }
        </script>
</head>
<body>
         <form name="order" action="calculations.php" method="get" onsubmit="return validate()">
                <p>37AX-L:</p>
                <input type="text" name="widget1" value="0" required/>
                <br>
                <p>42XR-J</p>
                <input type="text" name="widget2" value="0" required/>
                <br>
                <p>93XX-A</p>
                <input type="text" name="widget3" value="0" required/>
                <br>
                <input type="radio" name="State" value="MO" checked>Missouri</input>
                <br>
                <input type="radio" name="State" value="IL">Illinois</input>
                <br>
                <input type="submit" value="submit"/>
        </form>
</body>
</html>

Answer 2

你可以这样做

＆＃13;

$('#submitIT').submit(function(e){
  console.log("callingIT");
  var wid1 = document.getElementById("widget1").value;
                var wid2 = document.getElementById("widget2").value;
                var wid3 = document.getElementById("widget3").value;
                if(isNaN(wid1)||isNaN(wid2)||isNaN(wid3)){
                        console.log("all values entered must be numbers");
                        e.preventDefault();
                }
                else if(wid1 < 0 || wid2 < 0 || wid3 < 0){
                        console.log("all values must be greater than zero");
                        e.preventDefault();
                }
                if(wid1+wid2+wid3 > 25){
                        if(!confirm("you have more than 25 items. Will you accept the additional shipping?")){
                                e.preventDefault();
                        }
                }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
        
</head>
<body>
         <form id="submitIT" name="order" action="calculations.php" method="get">
                <p>37AX-L:</p>
                <input type="text" id="widget1" value="0" required/>
                <br>
                <p>42XR-J</p>
                <input type="text" id="widget2" value="0" required/>
                <br>
                <p>93XX-A</p>
                <input type="text" id="widget3" value="0" required/>
                <br>
                <input type="radio" id="State" value="MO" checked>Missouri</input>
                <br>
                <input type="radio" id="State" value="IL">Illinois</input>
                <br>
                <input type="submit" value="submit"/>
        </form>
</body>
</html>

＆＃13;

表格提交不起作用

2 个答案: