jquery 操作表单

来源：互联网发布：centos 6.5 ssh安装编辑：程序博客网时间：2024/05/28 20:19

1 select

<span style="font-size:14px;"><span style="font-size:14px;"><select id="select_1" name="select_2" /><option value="1">动物</option><option value="2">植物</option></select></span></span>

1) 获取select的text和value

$("#select_1").change(function(){}); //为select添加事件,选择一项就触发

var text = $("#select_1").find("option:selected").text(); //获取select选择的text

var value=$("#select_1").val(); //获取选择的value

var index=$("#select_1").get(0).selectedIndex; //获取选择的索引值

var maxIndex=$("#select_1 option:last").attr("index"); //获取最大的索引值

2)设置select的text和value

$("#select_1").get(0).selectedIndex=1; //设置索引为1的选中

$("#select_1").val(4); //设置value=4的选中

$("#select_1 option[text='123']").attr("selected",true); //设置select的text值为"123"的选中

3)添加删除select的option

$("#select_1").append("<option value="123">123</option>"); //追加一个option

$("#select_1").prepend("<option value='0'>请选择</option>"); //第一个位置插入一个option

$("#select_1 option:last").remove(); //删除最大的索引项(最后一个)

$("#select_1 option[index='0']").remove();

$("#select_1 option[value='123']").remove();

$("#select_1 option[text='4']").remove();

2 单选框

<span style="font-size:14px;"><span style="font-size:14px;"><input type="radio" id="radio_1" name="radio_1" value="冰淇淋" />我要吃冰淇淋</span></span>

3复选框

<span style="font-size:14px;"><span style="font-size:14px;"><input type="checkbox" id="radio_1" name="radio_1" value="bike" checked="checked" />I have a bike<input type="checkbox" id="radio_2" name="radio_2" value="car" />I have a car</span></span>

1 选中bike

$(":checkbox[name=radio_1]").attr("checked", true);

2 反选

$(":checkbox").each(function(){

$(this).attr("checked", !$(this).attr("checked"));

});

3 全不选

0 0