结合jQuery的序列化阵列脚本提交按钮

我用下面的表单，让游客到他们的答案提交给测试：结合jQuery的序列化阵列脚本提交按钮

<form action="grade.php" method="post" id="quiz"> 
    <ol> 
    <li style="display: none;"> 
     <?php echo join ($Base, ''); ?> 
    </li> 
    </ol> 
    <input type="hidden" name="PreviousURL" value="<?php echo $MyURL; ?>" id="url" /> 
    <input type="hidden" name="user_token" value="<?php echo isset($_POST['user_token']) ? $_POST['user_token'] : '' ; ?>" /> 
    <input type="submit" value="Submit Quiz" /> 
</form>

我想使用jQuery的序列化阵列功能，防止形式从提交如果用户没有回答所有问题。

但我不明白如何将jQuery脚本与表单结合起来。我假设我用我的表单的ID（'测验'）替换#myform。但是，我只是发布页面底部的jQuery脚本？

我试过了，但不起作用;如果我只回答一个问题，然后点击提交按钮，表单会将我转到结果页面。

<script> 
    $('#myform').submit(function(event){ 
    var answers = $('#myform').serializeArray(); 
    $.each(answers , function(index,value){ 
    if(value == ''){ 
    event.preventDefault(); 
    alert('you did not answer all the questions'); 
    }); 
</script>

来源

2016-03-04 David Blomstrom

如果你被允许使用HTML5，那么你总是使用required属性您需要输入字段，以防止提交。

除此之外，serializeArray()返回而不是检查if(value == '')尝试if(value.value == '')你正在检查对一个字符串的对象，而不是实际值看起来像

{ 
    name: <input_name>, 
    value: <input_value> 
}

所以在你的JavaScript对象的数组，。

来源

2016-03-04 01:50:19

我将value更改为value.value，但它仍然不起作用。不过，我喜欢你对所需属性的建议;我甚至没有意识到这一点。实际上，这似乎是最好的解决方案。一旦我完成设置和工作，我可能会选择这个作为正确的答案。 –

尝试编辑脚本将这些

<script type="text/javascript"> 
    $("#quiz").submit(function(){ 
     var answers = $('#quiz').serializeArray(); 
     for(var i=0;i<answers.length;i++){ 
      if(answers[i].value == ''){ 
       alert('you did not answer all the questions'); 
       return false; 
      } 
     } 
    }); 
</script>

来源

2016-03-04 01:20:17

Ryan Yu - 谢谢，但那对我来说也不适用。我只是意识到我已经链接到两个或三个不同的jQuery脚本，所以也许我在那里有冲突。 code.jquery.com/jquery-1.10.2.js，code.jquery.com/ui/1.11.2/jquery-ui.js我将不得不花费一些时间来研究它。 –

结合jQuery的序列化阵列脚本提交按钮

回答

相关问题