时间戳

首页 > 解决方案 > Javascript 警告框未显示和错误：您要求的文件不存在

javascript - Javascript 警告框未显示和错误：您要求的文件不存在

问题描述

我有几个月来一直在研究的这段 Javascript 代码。我的目标是在用户没有选择或输入答案时显示一个警告框并警告用户。

目前，我有两个问题发生。一个问题是警报框根本没有出现。另一个是有时我在新页面上收到此错误说：错误您要求的文件不存在“。不知道我哪里出错了。

<!DOCTYPE html>
<html>
<body>
<form name="quiz" class="quiz" onsubmit="return submitQuiz();">
                <ul style="list-style-type:none;">
                    <li><label id="web">Do you ever think about how you would design a web page?</label></li>
                    <br>
                    <li><input type="radio" value="no" id="rad1" name="rad1"/><span>No</span></li>
                    <li><input type="radio" value="yes" id="rad1" name="rad1"/><span>Yes</span></li>
                    <br>
                    <br>
                    <li><label for="prior">Which the following are your main priorities? If none, select N/A</label></li>
                    <li><select name="prior">
                        <option selected="" value="">**Please select one of the following**</option>
                        <option name="op1" id="op1">Ease of Use</option>
                        <option name="op2" id="op2">Graphics & Content</option>
                        <option name="op3" id="op3">The Data Collected</option>
                        <option name="op4" id="op4">Securing the site from possible attacks</option>
                        <option name="op5" id="op5">Overseeing the creation of software</option> 
                        </select>
                    </li>
                    <br>
                    <br>
                    <li><label id="res">Do you enjoy conducting research, asking questions, and building reports?</label></li>
                    <br>
                    <li><input type="radio" value="no" id="rad2" name="rad2"/><span>No</span></li>
                    <li><input type="radio" value="yes" id="rad2" name="rad2"/><span>Yes</span></li>
                    <br>
                    <br>
                    <li><label for="tx1">Does hacking a system or stopping a system from being hacked sound interesting to you? Type Yes or No:</label></li>
                    <li><textarea name="tx1" id="text1" maxlength="3"></textarea></li>
                    <br>
                    <li><input type="submit" value="Submit!" id="submit"></li>
                    <li><input type="reset" id="reset"></li>
                </ul>
            </form>

<script>
function submitQuiz() {
    "use strict";
    var radio1 = document.quiz.rad1;
    var radio2 = document.quiz.rad2;
    var ch1 = document.quiz.op1;
    var ch2 = document.quiz.op2;
    var ch3 = document.quiz.op3;
    var ch4 = document.quiz.op4;
    var ch5 = document.quiz.op5;
    var tx1 = document.quiz.text1;

    function answerScore (radio1, radio2, radio3, radio4) {
         var x = 0;
            //inserted missing braces
            if (radio1.checked && radio2.checked) {
                x + 1;
            }
            if (x === 0) {
                alert("You forgot a question!");
                radio1.focus();
                return false;
            }
            else if (x === 1) {
                alert("Completed!");
                window.location.reload();
                return true;
            }
        }
    function vCheck(ch1, ch2, ch3, ch4, ch5) {
                var y = 0;
                //inserted missing braces
                if (ch1.checked || ch2.checked ||ch3.checked || ch4.checked || ch5.checked) {
                    y++;
                }
                if (y === 0) {
                    alert("You forgot a question!");
                    radio1.focus();
                    return false;
                } else {
                    alert("Completed!");
                    window.location.reload();
                    return true;
                }
            }
            function vLength(tx1) {
                var txLength = tx1.value.length;
                if (txLength === 0 || txLength < 3) {
                    alert("That is an incorrect entry, try again.");
                    tx1.focus();
                    return false;
                } else {
                    return true;
                }
            }
            function vCheck2(tx1) {
                if ((tx1 === "Yes" || tx1 === "YES" || tx1 === "yes") && (tx1 === "No" || tx1 === "NO" || tx1 === "no")) {
                    tx1.focus();
                    return true;
                } else {
                    alert("Uhoh, you're missing an answer!");
                    txt1.focus();
                    return false;
                }
            }
    }
</script>

</body>
</html>

标签： javascripthtml

解决方案

这就是表单可以被验证和提交的方式。

function submitQuiz(myform) {
  "use strict";
  var errMsg = [];
  var hasError = false;
  if (!myform.rad1.value) {
    errMsg.push('Do you ever think...');
    myform.rad1[0].focus();//focus 1st option
    hasError = true;
  }
  if (myform.prior.value === 'none') {
    errMsg.push('Select main priopity');
    hasError || myform.prior.focus();
    hasError = true;
  }
  if (!myform.rad2.value) {
    errMsg.push('Do you enjoy...');
    hasError || myform.rad2[0].focus();
    hasError = true;
  }
  if (myform.tx1.value.toLowerCase() !== 'yes' && myform.tx1.value.toLowerCase() !== 'no') {
    errMsg.push('Type \'yes\' or \'no\'');
    hasError || myform.tx1.focus();
    hasError = true;
  }
  if (hasError) {
    alert(errMsg.join('\n'));
    return false;
  }
  //return false for debug purpose. In production return true
  alert('Submitting form');
 // return false;
}
<form name="quiz" method="get" class="quiz" onsubmit="return submitQuiz(this);">
  <ul style="list-style-type:none;">
    <li><label id="web">Do you ever think about how you would design a web page?</label></li>
    <br>
    <li><input type="radio" value="no" name="rad1" /><span>No</span></li>
    <li><input type="radio" value="yes" name="rad1" /><span>Yes</span></li>
    <br>
    <br>
    <li><label for="prior">Which the following are your main priorities? If none, select N/A</label></li>
    <li>
      <select name="prior">
        <option value="none">**Please select one of the following**</option>
        <option>Ease of Use</option>
        <option>Graphics & Content</option>
        <option>The Data Collected</option>
        <option>Securing the site from possible attacks</option>
        <option>Overseeing the creation of software</option>
      </select>
    </li>
    <br>
    <br>
    <li><label id="res">Do you enjoy conducting research, asking questions, and building reports?</label></li>
    <br>
    <li><input type="radio" value="no" name="rad2" /><span>No</span></li>
    <li><input type="radio" value="yes" name="rad2" /><span>Yes</span></li>
    <br>
    <br>
    <li><label for="tx1">Does hacking a system or stopping a system from being hacked sound interesting to you? Type Yes or No:</label></li>
    <!-- maxlength="3" not supported by textarea -->
    <li><textarea name="tx1"></textarea></li>
    <br>
    <li><input type="submit" value="Submit!" id="submit"></li>
    <li><input type="reset" id="reset"></li>
  </ul>
</form>

推荐阅读