jQuery 常用小功能
1、全选或者全不选form的Checkbox控件
function checkAll(objChkAll){
//找到表示全选/全不选的Checkbox控件所在的form元素
var frm = jQuery(objChkAll).parents().filter("form,:first");
if(frm != null){
//从form中找到所有的Checkbox控件，并设置checked属性值
jQuery(frm).find(":checkbox").attr("checked", objChkAll.checked);
}
}
2、判断form表单是否有选中的checkbox控件
function hasSelectedCheckbox(frm, _prefix){
//从form中找到所有Checkbox控件，这些控件的name值的前缀和指定值一致，并且这些控件的checked为true
var chkList = jQuery(frm).find(":checkbox[name^='" + _prefix + "']:checked");
if(chkList.length > 0){
return true;
}
return false;
}
3、找到name值以commId_o_开头的所有的input控件，返回一个集合。
var commList = jQuery("input[name^='commId_o_']");
if(commList.length > 0){
alert("找到数据！");
}
4、清空元素内的所有子元素，往元素中添加内容
HTML:
<div id="errorMessage"></div>
JS:
jQuery("#errorMessage").empty(); //删除匹配元素的所有子节点，而匹配的元素不删除
//jQuery("#errorMessage").remove(); //删除匹配的元素（包括其所有的子元素）
jQuery("#errorMessage").append("<p>dd</p>"); //可以增加子元素、文本等内容
jQuery("#errorMessage").text(msg); //增加文本内容
5、显示/隐藏对象
HTML:
<div id="divRule">message</div>
JS:
jQuery("#divRule").toggle();
6、Ajax应用：jQuery and jSON
JS:
var data = "{'details':[{'commId': '111', 'cardTypeId': '100'},{'commId': '111', 'cardTypeId': '200'},{'commId': '111', 'cardTypeId': '300'}]}";
jQuery.post("reqChiefSimSales.do?method=checkData", "det=" + data, function(s){
if(s != null && s.length > 0){
...
}else{
...
}
});
Java:
String det = request.getParameter("det");
JSONObject json = JSONObject.fromObject(det);
JSONArray array = json.getJSONArray("details");
for(int i=0;i<array.size();i++){
JSONObject obj = (JSONObject)array.get(i);
String commId = obj.getString("commId");
String cardTypeId = obj.getLong("cardTypeId");
System.out.println(commId + ", " + cardTypeId);
}
7、动态往select控件中添加option项（一）
jQuery.get("test2.htm", function(data){
jQuery("select[name=sel]").empty();
jQuery("select[name=sel]").append("<option value=''></option>");
var xmlObject = new ActiveXObject("MSXML2.DOMDocument");
xmlObject.async = false;
xmlObject.loadXML(data);
jQuery(xmlObject).find("option").each(function(i, n){
var key = jQuery(n).attr("key");
var value = jQuery(n).attr("description");
var option = "<option value='" + key + "'>" + value + "</option>";
jQuery("select[name=sel]").append("<option value='" + key + "'>" + value + "</option>");
});
});
<options>
<option key='key1' description='desc1'/>
<option key='key2' description='desc2'/>
</options>
8、动态往select控件中添加option项（二）
jQuery.get("test2.htm", function(data){
jQuery("select[name=sel]").empty();
jQuery("select[name=sel]").append("<option value=''></option>");
jQuery("select[name=sel]").append(data);
});
<option value='4'>44444</option>
<option value='5'>55555</option>