<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns=""><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="../scripts/jquery-1.3.1.js" type="text/javascript"></script> <script language="javascript"> $(function(){ /* val() 描述：获得第一个匹配元素的当前值 返回值:String,Array */ //select显示选中值 $("#bt_single").click(function(){ alert($("#single").val()); }); //多行select显示选中的多行的值，默认逗号隔开，可用join函数指定隔开符号 $("#bt_multiple").click(function(){ alert($("#multiple").val()); alert($("#multiple").val().join("&")); }); //radio显示选中值 $("#bt_radio").click(function(){ alert($(":radio:checked[name=r1]").val()); }); //checkbox 显示多个选中的的值 $("#bt_checkbox").click(function(){ //不能得到多个值，须手动拼接 alert($("input:checked[name=checkbox]").val()); var str =""; $("input:checked[name=checkbox]").each(function(){ str += $(this).val()+","; }); alert(str.substring(0,str.length-1)); }); /* val(val) 描述：设置一个匹配元素的值 这也可以为select元件赋值 */ $("#bt_single2").click(function(){ $("#single").val("Single3"); }); /* val(array) 描述：check,select,radio等都能使用为之赋值 注意：选项的value,text 只要其一满足条件就会被选中，多行select可以看出 */ $("#bt_p").click(function(){ $(":radio").val(["radio3"]); $(":checkbox").val(["check1","check2"]); $("#multiple").val(["Multiple4","Multiple5"]); }); }); </script></head><body> <select id="single"> <option>Single</option> <option>Single2</option> <option>Single3</option> </select> <input type="button" id="bt_single" value="显示选中值"/> <input type="button" id="bt_single2" value="赋值"/> <br/><select id="multiple" multiple="multiple">
<option selected="selected">Multiple</option> <option>Multiple2</option> <option selected="selected">Multiple3</option> <option value="Multiple4">Multiple4</option> <option value="Multiple5">Multiple5</option> <option value="Multiple5">Multiple6</option> </select> <input type="button" id="bt_multiple" value="显示选中值"/> <br/> <br/><input type="checkbox" name="checkbox" value="check1"/> 多选1
<input type="checkbox" name="checkbox" value="check2"/> 多选2 <input type="checkbox" name="checkbox" value="check3"/> 多选3 <input type="checkbox" name="checkbox" value="check1"/> 多选4 <input type="button" id="bt_checkbox" value="显示选中值"/> <br/> <input type="radio" name="r1" value="radio1"/> 单选1 <input type="radio" name="r1" value="radio2"/> 单选2 <input type="radio" name="r1" value="radio3"/> 单选3 <input type="button" id="bt_radio" value="显示选中值"/> <br/> <label>check,select,radio赋值</label><input type="button" id="bt_p" value="赋值"/></body>
</html>