Jquery 小案例之表单选择器

效果图：

表单中的代码：

<input type="button" value="使单选下拉框的'选择3号'被选中"/>
	<input type="button" value="使多选下拉框选中的'选择2号'和'选择4号'被选中"/><br>
	<input type="button" value="使多选框的'多选2'和'多选4'被选中"/>
	<input type="button" value="使单选框的'单选2'被选中"/><br>
	<input type="button" value="打印已经被选中的值"><br>

	<br/>
	
	<select id="single">
	  <option value="sel01">选择1号</option>
	  <option value="sel02">选择2号</option>
	  <option value="sel03">选择3号</option>
	</select>
	
	<select id="multiple" multiple="multiple" style="height:120px;">
	  <option value="mul01" selected="selected">选择1号</option>
	  <option value="mul02">选择2号</option>
	  <option value="mul03">选择3号</option>
	  <option value="mul04">选择4号</option>
	  <option value="mul05" selected="selected">选择5号</option>
	</select>
	
	<br/><br/>

	<input type="checkbox" name="c" value="check1"/> 多选1
	<input type="checkbox" name="c" value="check2"/> 多选2
	<input type="checkbox" name="c" value="check3"/> 多选3
	<input type="checkbox" name="c" value="check4"/> 多选4
	
	<br/>
	
	<input type="radio" name="r" value="radio1"/> 单选1
	<input type="radio" name="r"  value="radio2"/> 单选2
	<input type="radio" name="r"  value="radio3"/> 单选3

</body>

JQuery代码：
		<script type="text/javascript" src="../../script/jquery-1.7.2.js"></script>
	<script type="text/javascript">
		$(function(){
			//使单选下拉框的'选择3号'被选中
			$("input:first").click(function(){
				$("#single option:last").attr("selected","selected");
				//alert($("#single option:last").val())
			});
			//使多选下拉框选中的'选择2号'和'选择4号'被选中
			$("input:eq(1)").click(function(){
				$("#multiple").val(["mul02","mul04"]);
			});
			//alert($(":radio:eq(1)").val())
			//使多选框的'多选2'和'多选4'被选中
			$("input:eq(2)").click(function(){
				//$(":checkbox:eq(1)").attr("checked",true);
				//$(":checkbox:eq(3)").attr("checked",true);
				$(":checkbox").val(["check2","check4"])
			});
			//使单选框的'单选2'被选中
			$("input:eq(3)").click(function(){
				//$(":radio:eq(1)").attr("checked",true);
				$(":radio").val(["radio2"]);
			});
			//打印已经被选中的值
			$("input:eq(4)").click(function(){
				var $cc=$("select option:selected");
				$cc.each(function(){
					alert(this.innerText)
				});
				var $aa=$("input:checked");
				$aa.each(function(){
					alert(this.value)
				});
			});
			
		});
	
	</script>