javascript提交答案

【问题标题】：javascript submitjavascript提交
【发布时间】：2011-07-06 01:13:57
【问题描述】：

我有一个包含大约 4 个问题的表单，每个问题都有 2 个答案可供选择 - 单选按钮类型。

(1)你想喝牛奶吗？是的没有

(2)你快乐吗？是的没有

(3)你有父母吗？是的没有

(4)你有姐妹吗？是的没有

(1) 首先，我希望有一个 javascript 或 jquery 验证，以确保每个问题都有一个选择的答案，表单不应该以空值提交。

(20) 如果用户对任何问题选择“是”，它会将他们带到 Yes.html 页面如果用户选择否，那么它会将他们带到 No.html。为了让他们获得 No.html，他们必须为每个问题选择所有 No answers

所以是的，这里的偏好更高..

请帮忙。

我想要这个，但要进行验证以确保全部选中：

<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>

【问题讨论】：

你有什么尝试过的吗？还是一些现有的标记/脚本？

标签： javascript jquery jquery-plugins validation

【解决方案1】：

这里有一些 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;
}

【讨论】：

您需要提供比“它不起作用”更多的信息。您仍然没有提供任何您开始使用的标记或代码供我们帮助修复。
这是我用于验证的内容

【解决方案2】：

<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>

【讨论】：

只需添加一个计数器并确保您有 4 个复选框。
我不认识男人，但这仍然行不通……让我很沮丧
你的问题和答案很模糊。如果你不给我详细的信息，我帮不了你。

【解决方案3】：

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

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 上工作的示例。

【讨论】：