Question

当运行以下内容时，假设选中了男性，我希望jsonObj看起来像这样

0: Object
    name: "sex"
    value: "male_value"

然而，它最终看起来像这样。

0: Object
    name: "sex" 
    value: "male_value"
1: Object
    name: "sex" 
    value: "male_value"
2: Object
    name: "sex" 
    value: "male_value"
3: Object
    name: "sex" 
    value: "female_value"

HTML

<div id="form">
    <div id="radio_buttons">
        <input type="radio" name="sex" id="male" value="male_value">Male<br>
        <input type="radio" name="sex" id="female" value="female_value">Female
    </div>
</div>

JAVASCRIPT

function jsonAdd(name, value)
{                   
    item = {};
    item ["name"] = name;
    item ["value"] = value;

    jsonObj.push(item);
}

jsonObj = [];

$("#form input").each(function() {
    //Get Input Type
    type = $(this).attr("type");
    switch(type)
    {
        case "radio":
            if($(this).prop("checked"))
            {
                var name = $(this).attr("name");
                var value = $(this).val();
                jsonAdd(name, value);
            }
        case "checkbox":
            if($(this).prop("checked"))
                {
                    var name = $(this).attr("name");
                    var value = $(this).val();
                    jsonAdd(name, value);
                }
        default:
            var name = $(this).attr("name");
            var value = $(this).val();
            jsonAdd(name, value);
    }
});

如果我不使用switch语句，我似乎可以正常工作，但我不明白为什么一个简单的开关会导致这个问题？

Answer 1

与许多类C语言一样，如果您忘记添加case（如上所述here），则Javascript会从一个break落到下一个

所以：

switch(type)
{
    case "radio":
        if($(this).prop("checked"))
        {
            var name = $(this).attr("name");
            var value = $(this).val();
            jsonAdd(name, value);
        }
        break;

    case "checkbox":
        if($(this).prop("checked"))
            {
                var name = $(this).attr("name");
                var value = $(this).val();
                jsonAdd(name, value);
            }
        break;

    default:
        var name = $(this).attr("name");
        var value = $(this).val();
        jsonAdd(name, value);
        break;
 }

应该把你排除在外。

Answer 2

您忘记在交换机中添加break语句，在这种情况下，default选项将始终运行：

case "radio":
    if($(this).prop("checked"))
    {
        var name = $(this).attr("name");
        var value = $(this).val();
        jsonAdd(name, value);
    }
    break;
case "checkbox":
....

jQuery每个在同一个元素上运行多次

2 个答案: