javascript - 清空select中的option的问题
本文介绍了javascript - 清空select中的option的问题的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
使用$("select").html("")来清空一个动态生成的下拉框
当下拉选项只有一个的时候，清空操作结束后，代码清空了但是下拉框依旧显示选择项
如图所示
再点击一下下拉框选择项才消失
当有多个下拉选项的时候则不会出现这种情况
写了一个简易的代码
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
button {
width: 50px;
height: 20px;
}
</style>
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
</head>
<body>
<select></select>
<button>按钮</button>
<script>
var accountHtml = "",
account = ["1234123421"];
account.forEach(function(i) {
accountHtml += '<option value="' + i + '">' + i + '</option>';
});
$("select").html(accountHtml);
$("button").on("click", function() {
$("select").html("");
});
</script>
</body>
</html>想请教一下如何解决
解决方案
理论上不会出现~$("select").html("").val("");
试一下这个.
或者既然都清空了, 可以直接remove掉, 在生成一个也可以.
下面代码我测试一下清空select没问题~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="jquery.min.js"></script>
</head>
<body>
<select name="" id="select"></select>
<button class="dianwo">dianwo</button>
<script>
$(function(){
$("select").append("<option value='123'>123</option><option value='456'>456</option><option value='789'>789</option>");
$(".dianwo").click(function(){
$("select").html("");
})
});
</script>
</body>
</html>这篇关于javascript - 清空select中的option的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
