1.inputtext/hidden
取得id为textGroup1的元素
$("#textGroup1");
取得name为textGroup2的input
$("input[name='textGroup2']");
取得所有name为textGroup开头的input,遍历
var vTextGroup = $("input[name^='textGroup']");
vTextGroup.each(function(){
alert($(this).val());
});
取得所有name为textGroup结尾的input
var vTextGroup = $("input[name$='textGroup']");
取得所有id为textGroup3的元素,遍历
var vTextGroup = $("*[id*='textGroup3']");
vTextGroup.each(function(){
alert($(this).val());
});
设置id为textGroup1的元素的只读
$("#textGroup1").attr("readonly", true);
----------------------------
2.select
取得name为depart的select
$("select[name='depart']");
取得选中的value和text
$("select[name='depart']").find("option:selected").val();
$("select[name='depart']").find("option:selected").text();
$("select[name='depart']").val();
获取select选择的索引值
$("select[name='depart']").get(0).selectedIndex;
获取Select最大的索引值
$("select[name='depart'] option:last").attr("index");
设置Select索引值为1的项选中
$("select[name='depart']").get(0).selectedIndex=1;
设置Select的Value值为3的项选中
$("select[name='depart']").val(3);
设置Select的disabled(可否编辑)
$("select[name='depart']").attr("disabled", true);
$("select[name='depart']").attr("disabled", false);
添加onChange事件
$("select[name='depart']").change(function(){//code...});
-----
为Select追加一个Option(下拉项)
$("select[name='depart']").append("<optionvalue='add'>AddedValue</option>");
为Select插入一个Option(第一个位置)
$("select[name='depart']").prepend("<optionvalue='0'>请选择</option>");
删除Select中索引值最大Option(最后一个)
$("select[name='depart'] option:last").remove();
删除所有option
$("select[name='depart']").empty();
取得所有option,遍历
var vDepart = $("select[name='depart'] option");
vDepart.each(function(){
alert($(this).val());
});
----------------------------
3.checkbox
取得所有选中的name为departmentId的checkbox,遍历
var vDepartmentAry =$("input[name='departmentId'][type='checkbox']:checked");
vDepartmentAry.each(function(){
alert($(this).val());
});
选中/不选中 checkbox组的第四个元素
$("input[name='departmentId'][type='checkbox']").eq(3).attr("checked",true);
选中/不选中value为b2的checkbox
$("input[name='departmentId'][type='checkbox'][value='b2']").attr("checked",true);
$("input[name='departmentId'][type='checkbox'][value='b2']").attr("checked",false);
设置value为b3的checkbox的disabled(可否编辑)
$("input[name='departmentId'][type='checkbox'][value='b3']").attr("disabled",true);
----------------------------
4.radio
判断name为groupRadio的radio是否选中,如果选中alert出来
var vCheckedRadioVal =$("input[name='groupRadio'][type='radio']:checked").val();
if (!vCheckedRadioVal) {
alert('请选择集团')
return false;
} else {
alert(vCheckedRadioVal);
}
遍历所有name为groupRadio的radio
$("input[name='groupRadio'][type='radio']").each(function(){
alert($(this).val());
});
选中 radio单选组的第二个元素
$("input[name='groupRadio'][type='radio']").eq(1).attr("checked",true);
设置 radio单选组的第一个元素 的disabled(可否编辑)
$("input[name='groupRadio'][type='radio']").eq(0).attr("disabled",true);
选中/不选中value为a的radio
$("input[name='groupRadio'][type='radio'][value='a']").attr("checked",false);
----------------------------
5.Textarea
$("textarea[name=xxx]").text("111111aaaaaaadsdddsddsdsds");
----------------------------
CSS
toggleClass()对设置或移除被选元素的一个或多个类进行切换。
该方法检查每个元素中指定的类。如果不存在则添加类,如果已设置则删除之。这就是所谓的切换效果。
var parentTr = window.parent.$("#csvTblInfo tr");
parentTr.toggleClass("trCSS001");
----------------------------
Style
$('#img').attr('style', 'display: inline;');
$('#img').attr('style', 'display: none;');
----------------------------
Table
$(document).ready(function(){
// 循环取得table1的每一个tr
$('#table1 tr').each(function() {
// 取得每个tr中的第一个td的内容
alert($(this).find("td:first").text());
});
// 取得第一个tr中的第一个td中的input的值
alert($("#table1 tr:firsttd:first").find("input").val());
});
<table id="table1">
<tr>
<td>a<inputtype="text" value="111"/></td>
<td>
<inputid="allselect" name ="allselect" type="checkbox" value="12.01"/>周五004
</td>
</tr>
<tr>
<td>b<inputtype="text" value="222"/></td>
<td>
<inputid="allselect" name ="allselect" type="checkbox" value="13.01"/>周六005
</td>
</tr>
</table>