select的ajax显示下拉框 , 回显

最新推荐文章于 2022-09-10 02:03:50 发布

原创最新推荐文章于 2022-09-10 02:03:50 发布 · 3k 阅读

5 ·

CC 4.0 BY-SA版权

文章标签：

#html #ajax #select

java 同时被 2 个专栏收录

5 篇文章

订阅专栏

html

4 篇文章

订阅专栏

本文详细介绍如何使用jQuery操作Select元素，包括添加事件、获取选中项的Text和Value、获取和设置索引值、追加和删除选项等。同时提供动态填充Select框及回显参数的示例代码。

=====常用的select使用


<select class="select" name="available" id="select_id">
</select>

$("#select_id").change(function(){//code...}); //为Select添加事件，当选择其中一项时触发 
var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text 
var checkValue=$("#select_id").val(); //获取Select选择的Value 
var checkIndex=$("#select_id ").get(0).selectedIndex; //获取Select选择的索引值 
var maxIndex=$("#select_id option:last").attr("index"); //获取Select最大的索引值 

$("#select_id").append("<option value='Value'>Text</option>"); //为Select追加一个Option(下拉项)
$("#select_id").prepend("<option value='0'>请选择</option>"); //为Select插入一个Option(第一个位置)
$("#select_id option:last").remove(); //删除Select中索引值最大Option(最后一个)
$("#select_id option[index='0']").remove(); //删除Select中索引值为0的Option(第一个)
$("#select_id option[value='3']").remove(); //删除Select中Value='3'的Option
$("#select_id option[text='4']").remove(); //删除Select中Text='4'的Option

$("#select_id ").empty();

=分界线=====

// 显示 下拉框
function bankName(){
	var html ="";
	$("#select标签_ID名字").empty();//删除select的option
	$.post("请求路径", function(data){
  		
  		 html = "<option value=''>所属部门</option>" 
  		 for(var i=0; i<data.length; i++){
				var item = data[i];
				html+="<option value='"+item.data+"'>"+item.text+"</option>";
			}
  		 
 		});
 		$("#select标签_ID名字").html(html);
}

===========================

//回显   参数 value 表示要默认选中的值
function bankName( value ){
		$("#select option ").each(function () {
		
			   	if($(this).val()== value ){
						$(this).attr("selected","selected");
				}
		})
}

====================

//选择的下拉框值
$("#select标签_ID名字 option:selected").val();