jquery操作下拉框select(设置默认选中,清空选中状态)

取值问题

	<select id="selector">
    	<option value="1">选项一</option>
    	<option value="2">选项二</option>
    	<option value="3">选项三</option>
    	<option value="4">选项四</option>
	</select>
  1. 获取当前选中项的text和value
	$("#selector").find("option:selected").text();
	$("#selector").find("option:selected").val();
  1. 获取当前选中的索引值(从0开始)
	$("#selector").get(0).selectedIndex;
  1. 获取第一项(最小)和最后一项(最大)的text
	$("#selector option:last").text();
	$("#selector option:first").text();

更改和设置选中状态

  1. 改变select的选中,执行该语句后将第0个改为被选中状态,这里eq(i),i为索引值
    $("#selector").each(function(){
        $(this).find("option").eq(0).prop("selected",true)
    });
  1. 为select添加事件,当选择其中一项时触发事件
    $('#selector').change(function (e) {
       alert(1243);
    });
  1. 设置select索引值为1的项选中
    $("#selector").get(0).selectedIndex = 1;
  1. 设置select的value值为’1’的项选中
    $("#selector option[value='1']").prop("selected", true);

添加/删除select的option项:

  1. 为select追加一个option(下拉项),在末尾添加
    $("#selector").append("<option value='5'>选项五</option>");
  1. 为select追加一个option(下拉项),在起始添加
    $("#selector").prepend("<option value='5'>选项五</option>");
  1. 删除select中最后一个option
    $("#selector option:last").remove();
  1. 删除select中value='3’的option
	 $("#selector option[value='3']").remove();
发布了36 篇原创文章 · 获赞 18 · 访问量 2万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 精致技术 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览