jQ常见的form表单获取值（checkbox、text、select）

用惯了vue，直接数据绑定，不需要那么麻烦；但最近遇到一个项目，不得不使用jQ,所以操作dom变得习以为常，经常要获取某个元素的parent().parent()...,也需要获取大量表单的值。

1.关于checkbox：<input type="checkbox" name="enable" οnclick="openEnabele()" chee />

  attr()方法用于设置或返回被选元素的属性值；

  prop()方法用于获取匹配元素集合中的第一个元素的属性值；

（1）判断是否选中：

//jquery判断checked的三种方法:
//1.is(':checked')
if($("input:checkbox[name=enable]").is(':checked')) {
    alert("选中")
}
//2.attr
if($("input:checkbox[name=enable]").attr('checked)) {
    //版本1.6+返回:”checked”或”undefined” ;1.5-返回:true或false
    alert("选中")
}
//3.prop
if($("input:checkbox[name=enable]").prop('checked')) {
    //16+:true/false
    alert("选中")
}

（2）设置checkbox

jquery赋值checked的几种写法:
所有的jquery版本都可以这样赋值:
// $("#cb1").attr("checked","checked");
// $("#cb1").attr("checked",true);
jquery1.6+:prop的4种赋值:
// $("#cb1″).prop("checked",true);
// $("#cb1″).prop({checked:true}); 

2.关于input的type=text输入框：<input name="destPort" type="text" value="8080" />

 

3.关于select：<select id="servetype" name="proto" style="display: inline-block; vertical-align: middle;"><option value="tcp">tcp</option><option value="udp">udp</option><option value="tcp udp">tcp & udp</option></select>

说明：

以上仅供参考，某些方法或者属性失效也属于正常！