javascript - 使用 Javascript 或 Jquery 删除空白下拉列表

Question

是否可以编写一个 Javascript 函数来删除空白的下拉列表？

<form name="myform" method="post" enctype="multipart/form-data" action="" id="myform">
<div>
<label id="question1">1) Draw recognizable shapes</label>
        <br />
<input type="radio" value="Yes" id="question1_0" name="question1_0" />
        Yes
<input type="radio" value="No" id="question1_1" name="question1_1" />
        No
</div>
<div>
<label id="question2">2) Competently cut paper </label>
        <br />
<input type="radio" value="Yes" id="question2_0" name="question2_0" />
        Yes
<input type="radio" value="No" id="question2_1" name="question2_1" />
        No
</div>
<div>
<label id="question3">3) Hold a pencil</label>
        <br />
<input type="radio" value="Yes" id="question3_0" name="question3_0" />
        Yes
<input type="radio" value="No" id="question3_1" name="question3_1" />
        No
</div>
<input type="submit" value="Delete Drop Down" onclick="return checkanddelete"/>
</form>

例如，如果有人没有选择问题 2，它会删除问题 2 标签和下拉列表。

Answer 1

假设您实际上是指单选按钮组(而不是下拉列表)，那么首先您的 HTML 不正确，您需要设置 name每组单选按钮的值要相同:

<input type="radio" value="Yes" id="question1_0" name="question1" /> Yes
<input type="radio" value="No" id="question1_1" name="question1" /> No

然后您需要遍历单选按钮列表，如果组中没有被选中则删除父项 div :

$('input[type=submit]').on('click', function() {
    var radioArr = [];
    $(':radio').each(function(){
        var radName = this.name;
        if($.inArray(radName, radioArr) < 0 && $(':radio[name='+radName+']:checked').length == 0)
        {
            radioArr.push(radName);
            $(this).closest("div")
                   .remove();
        }
    });
    return false; //to stop the form submitting for testing purposes
});

当你在那里时，你可能想添加一些 <label for="">文本周围的标签。

这是一个jsFiddle of the solution .