1

是否可以编写一个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 标签和下拉菜单。

4

3 回答 3

2

假设您实际上是指单选按钮组（而不是下拉列表），那么首先您的 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。

于 2013-05-19T01:12:53.077 回答
0

如果您的下拉列表的 id 为 DropDown，并且您希望在提交点击时隐藏 dropdon：

function checkanddelete()
{
   if ( $('#question2_0.=:checked, #question2_1:checked').length )
      $('#dropdown').hide() // Or $('#dropdown').remove() if you do not plan on showing it again.
   return false; // if you plan on not submitting the form.. 
}

在页面模块中使用的优化包括向 div 添加适当的 id 和类，我假设在那里有完整的代码，但是如果您打算进行 UI 调整，我建议您不要在混合..

于 2013-05-19T01:35:55.453 回答
0

我不知道，你在“下拉菜单”下是什么意思，但这里有一些信息，可以帮助你。您可以为要删除的所有对象设置类名。例如

HTML

<div>
    <label class='question2' id="question2">2) Competently cut paper </label>
        <br />
    <input class='question2' type="radio" value="Yes" id="question2_0" name="question2_0" />
        Yes
    <input class='question2' type="radio" value="No" id="question2_1" name="question2_1" />
        No
</div>

JS

$(".question2").remove();

作为另一种解决方案，您可以在所有这些元素之上为 DIV 标签设置一个 ID

<div id='block_to_remove'>
    <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>

然后在 JS 中删除

$("#block_to_remove").remove();
于 2013-05-19T00:47:31.980 回答