清空select下拉框中的值(清空select选中数据)
怎么清除select已选择的内容
这篇文章主要介绍了jQuery如何取得设置清空select选择的文本与值,下面有个不错的示例,需要的朋友可以参考下
获取select :
获取select 选中的 text :
?
1
$("#ddlregtype").find("option:selected").text();
获取select选中的 value:
?
1
$("#ddlregtype ").val();
获取select选中的索引:
?
1
$("#ddlregtype ").get(0).selectedindex;
设置select:
设置select 选中的索引:
?
1
$("#ddlregtype ").get(0).selectedindex=index;//index为索引值
设置select 选中的value:
?
1
2
3
$("#ddlregtype ").attr("value","normal“);
$("#ddlregtype ").val("normal");
$("#ddlregtype ").get(0).value = value;
设置select 选中的text:
?
1
2
3
4
5
6
7
8
9
var count=$("#ddlregtype option").length;
for(var i=0;icount;i++)
{ if($("#ddlregtype ").get(0).options[i].text == text)
{
$("#ddlregtype ").get(0).options[i].selected = true;
break;
}
}
$("#select_id option[text='jquery']").attr("selected", true);
设置select option项:
$("#select_id").append("option value='value'text/option"); //添加一项option
$("#select_id").prepend("option value='0'请选择/option"); //在前面插入一项option
$("#select_id option:last").remove(); //删除索引值最大的option
$("#select_id option[index='0']").remove();//删除索引值为0的option
$("#select_id option[value='3']").remove(); //删除值为3的option
$("#select_id option[text='4']").remove(); //删除text值为4的option
清空 select:
$("#ddlregtype ").empty();
工作需要,要获得两个表单中的值。如图:
如何获得从左边选择框添加到右边选择框中的值?我想了想用网页特效可以获得,这里用了比较流行的jquery。
js代码如下:
//获取所有属性值 var item = $("#select1").val();
$(function(){
$('#select1').each( //获得select1的所有值
function(){
$('button').click(function(){
alert($('#select2').val()); //获得select2中的select1值
});
});
})
/script
值得注意的是,不能直接写成
$(function(){
$('#select2').each( //获得select1的所有值,因为前面讲选项从左边添加到右边,jquery其实并没有真正将值从左边传到右边。
function(){
$('button').click(function(){
alert($(this).val()); //获得select2中的select1值
});
});
})
html:
div class="centent"
select multiple="multiple" id="select1" name="dd" style="width:100px;height:160px;"
option value="1"选项1/option
option value="2"选项2/option
option value="3"选项3/option
option value="4"选项4/option
option value="5"选项5/option
option value="6"选项6/option
option value="7"选项7/option
/select
div
span id="add" 选中添加到右边/span
span id="add_all" 全部添加到右边/span
/div
/div
div class="centent"
select multiple="multiple" id="select2" name="sel" style="width: 100px;height:160px;"
/select
div
span id="remove"选中删除到左边/span
span id="remove_all"全部删除到左边/span
/div
/div
使用JQuery,Ajax调用动态填充Select的option选项
//绑定ClassLevel1单击事件
$("#ClassLevel1").change(function () {
var id = $("#ClassLevel1").val();
var level2 = $("#ClassLevel2");
level2.empty();
$("#ClassLevel3").hide();
$.ajax({
url: "./askCommon.ashx?action=getclasslevelpid=" + id,
data: { "type": "ajax" },
datatype: "json",
type: "get",
success: function (data) {
var json = eval_r(data);
for (var ind in json) {
level2.append($("option value='" + json[ind].id + "'" + json[ind].typename + "/option"));
}
}
});
})
js如何清除select中的值
思路:
获取select标签元素。
选出select下面的option项。
替换option里的内容,或是删除option。
代码:
script????
window.onload=function(){????
var?oSel?=?document.getElementById('sel');????
var?oOpt?=?new?Option('123','abc');????
oSel.appendChild(oOpt); ???//添加一个option
oSel.removeChild(oOpt);????//删除一个option
};????
/script????
/head????
body????
select?id="sel"????
option1234/option????
/select
vue 清除下拉框的值
你用了vue就要习惯数据操作,你这还是属于dom操作。
select 里的选项 ,用一个json数组来循环出来,v-for,
清空的时候,把数据源清空,就可以了,重新赋值也是一样,
这是你的解决方法的vue版。
但是,你如果只是想变成空项,在该select 标签上进行v-model双向绑定,第一个选项的值设定为空,给select 重新选值就ok
知识点就是这么多0 - 0自己查好了
如何清除select框里显示的内容
添加完后你可以重置一下select的默认选项,用selectedIndex。
selectedIndex 属性可设置或返回下拉列表中被选选项的索引号。
js清空select选中的值
可以直接更改option的选择属性,jquery可以设置select的值为空。
select当中的选项在选中的时候会带有选择属性,区别于其他option元素,所以更改这个属性可以清楚选择。
jquery则可以很方便设置select的值,清空也比较简单。