js清空select选中的值和选项

最新推荐文章于 2021-12-15 11:25:37 发布

Analyze_ing

最新推荐文章于 2021-12-15 11:25:37 发布

阅读量5k

点赞数 3

CC 4.0 BY-SA版权

分类专栏：前端文章标签： html jsp javascript

本文链接：https://blog.youkuaiyun.com/Analyze_ing/article/details/121379082

前端专栏收录该内容

7 篇文章

订阅专栏

本文介绍如何利用jQuery来动态地向HTML下拉框中添加选项，并提供了一种方法来清空已有的选项和取消选定的值。适用于需要动态更新下拉框内容的场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

html中的下拉选项，后面的选项可通过jq追加进来：
<form:select path="testId" id="testId" name="testId" class="input-xlarge ">
   <form:option value="" label=""/>
</form:select>

jq追加选项：
$("#testId").append( //此处向select中循环绑定数据
 "<option value="+data.testist[i].id+ ">" + data.testist[i].name+ "</option>");

通过下面两个清空select内的选项和选中的值，其实一般用empty()可以把两个内容都清除了，但是避免其他情况（我就遇到了只能清除选项不能清楚选中的值的问题），要把text也设置为空，.select2-chosen这个需要你用f12去调试网页，看看select选中的值的class是什么，然后换成那个class。
$("#testId").empty();
$(".select2-chosen").text("");