select选择器和checkbox复选框区分

1、 select

<select name="xxxSelectKey">
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
    <option value="mercedes">Mercedes</option>
    <option value="audi">Audi</option>
</select>
1、设置value为optionXX的项选中
     $(".xxxSelectKey").val("pxx");
2、设置text为pxx的项选中
    $(".xxxSelectKey").find("option[text='optionXX']").attr("selected",true);
3、获取当前选中项的value
    $(".xxxSelectKey").val();
4、获取当前选中项的text
    $(".xxxSelectKey").find("option:selected").text();

2、 checkbox

		<div style="margin-bottom:20px">
			<input  name="xxxChecKey" value="Apple" label="Apple:">
		</div>
		<div style="margin-bottom:20px">
			<input  name="xxxChecKey" value="Orange" label="Orange:">
		</div>
		<div style="margin-bottom:20px">
			<input  name="xxxChecKey" value="Banana" label="Banana:">
		</div>
1、设置value为optionXX的项选中
     $(".xxxChecKey").val("pxx");
2、设置text为pxx的项选中
    $(".xxxChecKey").find("option[text='optionXX']").attr("checked",true);
3、获取当前选中项的value
    $(".xxxChecKey").val();
4、获取当前选中项的text
    $(".xxxChecKey").find("option:checked").text();

3 checkbox和select共同点

1、用一个Key对应多项选项
2、用一个key进行收集option(s)选项的值,进而获取选项的值 label是文本显示标签,value是收集label背后的值,进而被xxxKey获取

4 3 checkbox和select区分

select选择器可以支持单选或者多选(multiple:true)

你可能感兴趣的:(JS,javascript,select,combobox,checkbox)