由于最近在工作中对表单的接触比较多,对表单的属性操作也比较多,因此总结一下jquery中对表单属性的操作,方便以后工作中的使用。
1.获取下拉框的选取值/文本有以下几种方法
(1)$("#select_id option:selected").text();//获取文本
(2)$("#select_id").find('option:selected').text();//获取文本
(3)$("#testSelect").val();//获取值
(4)$("select[@name=items] option[@selected]").text();//获取select被选中项的文本
(5)$('#select_id')[0].selectedIndex = 1;//radio单选组的第二个元素为当前选中值
//获取索引值
(6)var checkIndex=$("#select_id").get(0).selectedIndex;//获取Select选择的索引值
(7)var maxIndex=$("#select_id option:last").attr("index");//获取Select最大的索引值
2.为下拉框添加值,删除值
(1)$("#select_id").append("<option value='Value'>Text</option>");//为Select追加一个Option(下拉项)
(2)$("#select_id").prepend("<option value='0'>请选择</option>");//为Select插入一个Option(第一个位置)
(3)$("#select_id option:last").remove();//删除Select中索引值最大Option(最后一个)
(4)$("#select_id option[index='0']").remove();//删除Select中索引值为0的Option(第一个)
(5)$("#select_id option[value='3']").remove();//删除Select中Value='3'的Option
(6)$("#select_id option[text='4']").remove();//删除Select中Text='4'的Option
(7)$("#select_id ").get(0).selectedIndex=1;//设置Select索引值为1的项选中
(8)$("#select_id ").val(4);//设置Select的Value值为4的项选中
(9)$("#select_id option[text='jQuery']").attr("selected",true);//设置Select的Text值为jQuery的项选中
(10)为select添加新option
function addOption(newOption){
var len = $("select[@name=select_name] option").length
if(newOption.value != "able_value"){
$("select[@name=select_name] option").each(function(){
if($(this).val() == 1){
$(this).remove();
}
});
}else{
$("<option value='1'>an apple</option>").appendTo($("select[@name=select_name]"));
}
}
3.获取文本框的值
(1)$("#text").attr("value");
(2)$("#text").val();