Question

我一整天都在努力解决这个问题，看起来很简单，但是如何从一组选择下拉列表中清除（不删除）所有选项呢？我想让他们在首次加载div时重新设置为默认状态。我不能使用.reset，因为我需要收集表单中的其他信息，但我需要允许用户改变他们的想法而不会受到惩罚（必须重新填写表格）。

这个SO问题向您显示how to remove the options这不是我需要的。

这个问题seemed to give the answer，但我无法让它发挥作用。

这个 jQuery bug entry 似乎暗示可以使用.empty（）来完成，但这也不起作用。

这SO question lists a bunch of different ways to do exactly what I want，我已经尝试了所有这些（见下面的代码），没有效果。我显然错过了一些东西。

这是一个问题的 JSfiddle 。

如何查看小提琴中的问题：

在修复状态，点击已修复;显示两个新输入，一组单选按钮，然后是每个选择选项下拉菜单。在类别下，选择零件质量，然后从下拉列表中选择任何项目。这个选择现在应该出现在下拉列表中。现在单击其他任何一个类别，然后再返回“零件质量”。您仍然会显示您刚刚做出的相同选择，而不是默认的“选择零件质量原因”，这就是我想要的。

我的尝试主要集中在用于概念验证的零件质量单选按钮，但是生产代码需要清除所有<所有条目/ em>选项 - 选择表单除了报告部门下拉列表。我最好能使用$(this)结构的泛型选择，但这不是必需的。像这样：

$("select option:selected").each(function () { $(this).val(''); //doesn't work });

要求：

当用户选择其他单选按钮（类别）时，所有选项下拉菜单都将重置为默认状态。这样当用户做出他们的最终选择时点击提交，没有多余的条目。 当他们更改类别选择时，基础代码必须保留报告部门下拉选项。

然后，我可以将他们选择的所有部分和部分收集到一个JSON字符串中，以便对我的代码隐藏进行AJAX调用，并将数据插入到MySQL数据库中。

我不在乎答案是使用jQuery还是纯JavaScript，我可以愉快地使用。

以下是一些尚未解决的尝试：

$("#formEvent_repair input[type='radio']").on('change', function () { //$("#select_part_quality_repair option:selected").attr("selected", false); //$("#select_part_quality_repair").find('[selected]').removeAttr("selected"); //$('#select_part_quality_repair').attr('selectedIndex', '-1'); //$('#select_part_quality_repair').val(null); $("#select_part_quality_repair").find('option:first').attr('selected','selected'); //$("select option:selected").val([]); //$("select option:selected").html(''); //$("select_part_quality_repair").html(''); $("select_part_quality_repair").append().html(''); $("select option:selected").each(function () { console.log("Emptying select options"); $("#select_part_quality_repair").find('option:first').attr('selected','selected'); //#select_part_quality_repair-button > span //$("#select_part_quality_repair").prop('selectedIndex', -1); //$("#select_part_quality_repair").find('option').attr("selected", false); //$("#select_part_quality_repair option").attr("selected", false); $("#select_part_quality_repair option:selected").attr("selected", false); console.log(this); $(this).val([]); });

Answer 1

因为您正在使用jquery mobile，所以您需要向您更改的元素发出刷新命令。

$('#select_part_quality_repair').val('').selectmenu('refresh');

这将取消选择任何选项，然后刷新布局以显示更改..

对于您在代码中设置的单选按钮，使用

$(<radio-button-selector>).checkboxradio("refresh");

Answer 2

您清除下拉选项如下：

$("#select_part_quality_repair").val("");

这将清除选择而不删除成员。

此外，代码中的这一行格式不正确：

$("select_part_quality_repair").append().html('');

你忘了把＃＆＃34;＃＆＃34;在元素ID之前，如JQuery所要求的那样。无论如何，这条线不会帮助你，所以你甚至不应该为此烦恼。

干杯，

- =卡梅伦

Answer 3

取消选中所有单选按钮

$(".clear").click(function(){
    $('input:radio').each(function () {

        $(this).removeAttr("checked");

    });
});

编辑2：

取消选中所有选项

$(".clear").click(function(){
    $('select').each(function () {

        $(this).removeAttr("selected");

    });
});

单击单选按钮清除所有选项选择条目

3 个答案: