val()方法返回或设置被选元素的值。元素的值是通过 value 属性设置的。该方法大多用于 input 元素。如果该方法未设置参数,则返回被选元素的当前值。
语法:$(selector).val(value)
常用方式
<input type="text" id="email" value="请输入邮箱"/> <input type="text" id="qq" value="请输入qq号"/> <input type="text" id="nickname" value="王"/> <input type="button" id="tijiao" value="提交"/> <script> //常用的几种情况 $("#tijiao").click(function(){ alert($("#email").val());//取值 $("#qq").val("123456789");//赋值 //在默认值的基础上增加值 $("#nickname").val(function(n,c){ return c + " 尼玛"; }); }) //当获得焦点时,清空文本框中的内容 $("#email").focus(function(){ var aaa = $(this).val(); //this.defaultValue就是当前文本框的默认值 if(aaa==this.defaultValue){ $(this).val(""); } }); </script>
val()还能使select(下拉列表框)、checkbox(多选框)和radio(单选框)相应的项被选中,这在表单操作中经常会用到
<input type="button" value="select单选"/> <input type="button" value="select多选"/> <input type="button" value="checkbox多选"/> <input type="button" value="radio单选"/> <h3>select单选</h3> <select id="single"> <option value="1">选择1号</option> <option value="2">选择2号</option> <option value="3">选择3号</option> <option value="4">选择4号</option> <option value="5">选择5号</option> </select> <h3>select多选</h3> <select id="multiple" multiple="multiple" style="height:120px;"> <option value="1">选择1号</option> <option value="2">选择2号</option> <option value="3">选择3号</option> <option value="4">选择4号</option> <option value="5">选择5号</option> </select> <h3>checkbox多选</h3> <input type="checkbox" value="check1"/>多选1 <input type="checkbox" value="check2"/>多选2 <input type="checkbox" value="check3"/>多选3 <input type="checkbox" value="check4"/>多选4 <h3>radio单选</h3> <input type="radio" name="sex" value="男"/>单选1 <input type="radio" name="sex" value="女"/>单选2 <input type="radio" name="sex" value="人妖"/>单选3 <script> $(function(){ //设置select单选 $("input:eq(0)").click(function(){ $("#single").val("3"); var options=$('#single option:selected') //alert(options.val()); }); //设置select多选 $("input:eq(1)").click(function(){ $("#multiple").val(["1","3","5"]);//以数组的形式赋值 }); //设置checkbox多选 $("input:eq(2)").click(function(){ $(":checkbox").val(["check2","check3"]);//以数组的形式赋值 }); //设置radio单选 $("input:eq(3)").click(function(){ $(":radio").val(["女"]); }); }); </script>
有朋自远方来...评论一下呗O(∩_∩)O