您的位置:首页 > Web前端 > JQuery

jquery(4-5) val()处理表单元素值

2017-10-08 11:37 417 查看
注意:本文运行例子请在大人陪同下进行查看 查看实例

例子:text(文本)

<input type="text" name="text" id="text" value="lph">

获取:value = $("#text").val() 或者 $("#text")[0].value

设置:$("#text").val(1111)

例子: textarea(文本域)

<textarea name="textarea"  id="textarea" rows="4" cols="35">春风吹又吹</textarea>

获取:value= $("#textarea").val()

设置: $("#textarea").val("独上兰州");

其中复习html知识:

1.rows 设置textarea高度(类似于height),cols设置textarea宽度(类似于width),

2.给textarea赋值时候应该写进<textarea>赋值内容</textarea>,而不是 <textarea value="xxxx"></textarea>

例子: radio (单选框)

<input type="radio" name="radio" value="0" id="radio1" checked="checked">
<label for="radio1">掐人中</label>
<input type="radio" name="radio" id="radio2" value="2">
<label for="radio2">点穴手</label>

获取:$("input[name=radio]:checked").val();

设置: $("input[name='radio'][id='radio2']").attr("checked",true);
其中复习html知识:

1.radio 选中 checked="checked"

2.label for="跟标签id"

例子checkbox

<input type="checkbox" name="checkbox" value="0" id="checkbox1" id="checkbox1" checked="checked">
<label for="checkbox1">吃饭</label>
<input type="checkbox" name="checkbox" value="1"  id="checkbox2" checked="checked">
<label for="checkbox2">睡觉</label>
<input type="checkbox" name="checkbox"  value="2" id="checkbox3">
<label for="checkbox3">打豆豆</label>

获取打印:

$("input[name='checkbox']:checked").each(function(){
console.log( $(this).val());
})

设置#checkbox3 为选中状态:$("input[name='checkbox'][id='checkbox3']").attr("checked",true);

注意:获取选中状态时如果不是遍历获取选中值,而通过$("input[name='checkbox']:checked").val()将获取第一个选中的checkbox值

例子:select

<select id="select">
<option value="0">贫穷</option>
<option value="1" selected="selected">吃得饱</option>
<option value="2">吃得好</option>
<option value="3">富裕</option>
</select>

获取select选中: $("#select").val()

设置select选中为 "富裕" 选项:$("#select").val(3)

这里设置是通过value进行设置选中,实际开发项目中还有其他选中的需求请查看具体事例
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  jQuery