javascript submit

我有一个约4个问题的形式，每个有2个答案可供选择 - 单选按钮类型。javascript submit

（1）你想喝牛奶吗？是否

（2）你快乐吗？是否

（3）你有父母吗？是否

（4）你有姐妹吗？是否

（1）首先我想要一个javascript或jquery验证以确保每个问题都有一个答案选择，表单不应该用null值提交。（20）如果用户为任何问题选择“是”，则如果用户选择“否”，则它将它们带到“是”页面中，如果用户选择“否”，则将它们带到No.html。对于他们才能到No.html，他们将不得不选择每个问题

都没有回答，所以是的，是这里的更高的优先级..

请帮助。

我想这一点，但与验证，以确保所有被选中：

<script type="text/javascript"> 
    function choosePage() { 
     if(document.getElementById('weightloss').form1_option1.checked) { 
      window.location.replace("http://google.com/"); 
     } 
     if(document.getElementById('weightloss').form1_option2.checked) { 
      window.location.replace("http://yahoo.com/"); 
     } 
    } 
</script> 

<form id="weightloss"> 
    <input type="radio" id="form1_option1" name="weight-loss" value="5_day" class="plan"> 
    <label for="form1_option1"> 5 Day - All Inclusive Price</label><br> 
    <input type="radio" id="form1_option2" name="weight-loss" value="7_day"> 
    <label for="form1_option2"> 7 Day - All Inclusive Price</label><br> 
    <input type="button" value="Place Order" alt="Submit button" class="orange_btn" onclick="choosePage()"> 
</form>

来源

2011-02-28 user634599

尖利的帮助？ – user634599 2011-02-28 20:34:33

你有什么试过吗？或者一些现有的标记/脚本？ – 2011-02-28 20:47:38

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
</head> 
<body> 
    <form onsubmit="validate(this); return false;"> 
     <table> 
      <tr> 
       <td>Do you want milk?</td> 
       <td>Yes<input type="radio" name="milk" class="Yes" /> No <input type="radio" name="milk" class="No" /></td> 
      </tr> 
      <tr> 
       <td>Are you happy?</td> 
       <td>Yes<input type="radio" name="happy" class="Yes" /> No <input type="radio" name="happy" class="No" /></td> 
      </tr> 
      <tr> 
       <td>Do you have parents?</td> 
       <td>Yes<input type="radio" name="parents" class="Yes" /> No <input type="radio" name="parents" class="No" /></td> 
      </tr> 
      <tr> 
       <td>Do you have sisters?</td> 
       <td>Yes<input type="radio" name="sisters" class="sisters" /> No <input type="radio" name="sisters" class="No" /></td> 
      </tr> 
      <tr> 
       <td colspan="2"><input type="submit" value="Done" /></td> 
      </tr> 
     </table> 
    </form> 
</body> 
</html> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> 
<script type="text/javascript"> 
    function validate(form) { 
     var hasYes = false; 
     var counter = 0; 
     $("input:checked", form).each(function() { 
      if ($(this).hasClass("Yes")) { 
       hasYes = true; 
      } 
      counter++; 
     }); 
     if (hasYes == true || counter != 4) 
      window.location = "Yes.html"; 
     else 
      window.location = "No.html"; 
    } 
</script>

来源

2011-02-28 20:54:16 jnoreiga

这很好，但不验证。 – user634599 2011-02-28 21:03:30

只需添加一个计数器，并确保您有4个复选框。 – jnoreiga 2011-02-28 21:08:02

我为你更新了它。 – jnoreiga 2011-02-28 21:11:58

下面是一些HTML：

<form name="myForm" id="formId"> 
    <span>Do you want milk?</span> 
    <input type="radio" name="milk" value="yes" /><label>yes</label> 
    <input type="radio" name="milk" value="no" /><label>no</label> 

    <span>Are you happy?</span> 
    <input type="radio" name="happy" value="yes" /><label>yes</label> 
    <input type="radio" name="happy" value="no" /><label>no</label>

依此类推，直到...

<a onclick="validate();">Click here to submit</a> 
</form>

您的javascript：

function validate(){ 
    var data = $("#formId").serialize(); 
    var field; 
    for (field in data){ 
     if (data.hasOwnProperty(field)){ 
      if (data[field] == "yes"){ 
       window.location = "yes.html"; 
       return; 
      } 
     } 
    } 
    window.location = "no.html"; 
    return; 
}

来源

2011-02-28 21:00:58 mmurch

它不工作。 – user634599 2011-02-28 21:11:47

您需要提供比“不工作”更多的信息。您还没有提供任何您已经开始使用的标记或代码，以帮助我们解决问题。 – mmurch 2011-02-28 21:17:14

这是我的验证 – user634599 2011-02-28 21:31:17

如果你只需要确保每个命名单选按钮组被选中，你可以使用类似以下内容：

var names = []; 
$("input[type=radio]").each(function() { 
    if (!!$.inArray($(this).attr("name"), names)) { 
     names.push($(this).attr("name")); 
    } 
}); 
var $checkedRadio = $.map(names, function(name) { 
    return $("input[name=" + name + "]:checked"); 
}); 

if(names.length !== $checkedRadio.length){ 
    //dont submit 
    return false; 
}

的这对jsfiddle工作示例。

来源

2011-03-01 00:06:38

回答

相关问题