Question

我的页面上有3个选择框，然后点击关闭按钮我要清除班级.popup下的所有选择框。

以下是我清除字段的代码。

clearText: function() {
    $('.popupBody input').val('');
    $('.popupBody select').val('');
    $('.popupForm').find('.errmsgActive').removeClass('errmsgActive');
    $('.popupForm').find('.errmsg').html('');
}

为了清除.popupBody类中的所有选择框，我使用下面的代码。

 $('.popupBody select').val('');

Answer 1

您的代码看起来不错..显然$('.popupBody select').val('');正在清除.popupBody下的选择下拉列表的值。

BUT

确保所有选择输入必须具有选项value=''。

见下面的代码

＆＃13;

$(".popupBody select").select2();
$("#clear").click(function(){
$('.popupBody select').val('-1').change();
})

＆＃13;

@import "https://select2.github.io/dist/css/select2.min.css";

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://select2.github.io/dist/js/select2.full.js"></script>

<div class="popupBody">
<select>
<option value="-1">Select</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>

<select>
<option value="-1">Select</option>
<option value="A1">A1</option>
<option value="B1">B1</option>
<option value="C1">C1</option>
</select>

<select>
<option value="-1">Select</option>
<option value="A2">A2</option>
<option value="B2">B2</option>
<option value="C2">C2</option>
</select>
</div>
<button id="clear">Clear</button>

＆＃13;

Answer 2

要重置下拉列表，您需要选择默认元素，通常是第一个：

 $('.popupBody select').find('option:first-child').attr('selected','selected');

重置select2使用中的值

$('.popupBody select').select2("val", "");

Answer 3

试试这个，这对你有用。

＆＃13;

<!DOCTYPE html>
<html>
<head>
	<title></title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>

<div class="popupBody">
	<label>Select option one</label>
	<select>
		<option value="">-- select --</option>
		<option>select1 value 1</option>
		<option>select1 value 2</option>
		<option>select1 value 3</option>
	</select>
	<br><br><br>

	<label>Select option two</label>
	<select>
		<option value="">-- select --</option>
		<option>select2 value 1</option>
		<option>select2 value 2</option>
		<option>select2 value 3</option>
	</select>
	<br><br><br>

	<label>Select option Three</label>
	<select>
		<option value="">-- select --</option>
		<option>Stackoverflow</option>
		<option>is</option>
		<option>awesome</option>
	</select>
	<br><br><br>
	<input type="button" name="" value="CLEAR" id="closebutton">

</div>

<script type="text/javascript">
	$(document).ready(function(){
		$("#closebutton").click(function(){
			$("div.popupBody select").val("");
		});
	});
</script>

</body>
</html>

＆＃13;

Answer 4

要清除在select2选择框中进行的选择，您可以尝试以下方法：

$('.popupBody select').each(function(){
    //iterate over all the select boxes one by one
    $(this).select2("val", ""); //clearing the selection made
});

点击页面的关闭按钮，我想清除所有选择框值

4 个答案:

见下面的代码