JavaScript文本框验证不起作用？

Question

昨天我大部分时间都在尝试解决这个问题，但是没有运气-我对Javascript还是很陌生，所以请多多包涵。 我正在尝试创建一个问卷，作为要求我做的项目的一部分。

我有以下代码，该代码创建了一定数量的文本框供用户输入问题-他们选择希望创建多少个文本框/问题。 这是执行文本框创建并将用户希望创建的问题数量传递给Javascript的代码：

     <?php
       //Loop for question textboxes
       for ( $i = 1; $i <= intval($_SESSION['Questions']); $i++ ) { 
         echo"
           <b>Question ". $i  ."</b><br>
           <input type='text' style='width: 42em;' name='box{$i}' id='box{$i}'>
           <br><br>
         "; 
       }
       echo'
         <br>
         <input type='.Submit.'>
         <br><br>
       ';              

     ?>

     <script>
       var Questions = <?php echo json_encode($_SESSION['Questions']); ?>;
     </script>

然后提交表单：

function QuestionsValidation(f) {

        var msg = "";

        for (i = 1; i <= Questions; i++) {
          if (f.box+i.value == "") {
              msg += "Question" +i "empty!\n";                
          }
        }

        if (msg !== "") {
            alert ("Errors in form:\n" + msg);
          return false;
        }

        else {
          return true;
        }
}

我几乎可以肯定，它不起作用的原因是在javascript For循环内的IF语句中，但是我很感谢任何建议。 我在For循环中删除了IF语句，并将其替换为：

        for (i = 1; i <= Questions; i++) {
          msg += f.box+i.value;                
        }

尝试找出问题的根源。它返回NaN吗？

Answer 1

通过循环创建文本框时，为每个文本框添加一个类，例如

<input type='text' class='question' style='width: 42em;' name='box{$i}' id='box{$i}'>

在提交按钮上，调用validateQuestions（）函数，例如

<input type='submit' onclick='return validateQuestions();' value='Submit' />

编写以下jQuery代码

$(function(){
function validateQuestions(){
     $('.question').each(function(){
        if ($(this).val()==''){
            alert('Question is required.'); // or write error msg in a div
            $(this).focus();
            return false;
        }
     })
}        
})

注意：也尝试阅读jQuery Validation插件。

希望这可以帮助 ！