常用的jquery函式總結
阿新 • • 發佈:2019-02-09
<pre name="code" class="javascript">
1、表單驗證
2、$.post
function save_project(ctx){ alert(121); /*if(!checkForm()){ return; }*/ var url="${ctx}/project/ajax/save_project"; var param=$("#proForm").serialize(); param=param+"&random="+Math.random(); alert(param); $.post(url,param,function(json){ if(!json.flag){ alert("失敗"); }else{ alert("成功"); } }); }
3、$.ajax
function doTestJson(ctx){ alert( $("#proForm").serialize()); $.ajax({ url:ctx+'/project/ajax/save_project', type: 'POST', data: $("#proForm").serialize(), dataType: 'json', contentType:'application/json;charset=UTF-8', success: function(json) { alert(json.result); } }); }
//序列化表單元素,返回json資料
var params = $("#userForm").serializeArray();
//也可以把表單之外的元素按照name value的格式存進來
//params.push({name:"hello",value:"man"});
4、form提交
第一種:
$(function() { $("#tijiao").click(function() { if(checkForm()){ $("#myForm").ajaxSubmit({ url: "${ctx}/teacher/addTeacher.shtml", // 提交的頁面 data: $("#myForm").serialize(), // 從表單中獲取資料 type: "POST", // 設定請求型別為"POST",預設為"GET" dataType:"json", success: function(json) { jAlert(json.result, '結果',function(r){ if(json.flag) { window.close(); }else { return; } }); } }); }else{ jAlert("請檢查表單必填項,是否填寫", '結果'); } return false; }); });
$(function(){});這個是必須的。
第二種:
//儲存所有選中的
$("#myForm2").submit(function() {//重點難點
if(true){
$(this).ajaxSubmit({
url: "${ctx}/courseservices/saveText.shtml",
data: $("#myForm2").serialize(),
type: "POST",
dataType:"json",
success: function(json){
if(!json.flag){
alert('失敗');
}else{
alert('成功');
}
}
});
}
return false;
});
5、jquery全選/取消 checkbox
$("#checkall").click(function(){
if(this.checked){
$("input[type='checkbox'][name='indexs']").each(function(){this.checked=true;});
}else{
$("input[type='checkbox'][name='indexs']").each(function(){this.checked=false;});
}
});
6、級聯選擇
/**
* 組織機構聯想查詢
* @param name
* @param selectId
* @param deptType
*/
function getDeptByName(name,selectId,deptType){
$.ajax({
url:contextPath+"/public/getDeptByName.shtml",
type:"post",
data:{"deptName":$("#"+name).val(),"deptType":deptType,"r":Math.random()},
dataType:"json",
success:function(msg){
$("#"+selectId).empty();
$('#'+selectId).append("<option value=''>請選擇</option>");
$.each(msg.mapList, function(i, item) {
$('#' + selectId).append("<option value='" + item.deptId + "'>"+item.deptName+ "</option>");
});
}
});
}
or
/**
* 場地聯動查詢
* target 目標name
* */
function getVenuesByAreaId(areaId,target){
$.ajax({
url:contextPath+"/getVenuesByAreaId.shtml",
type:"post",
data:{"id":areaId,"r":Math.random()},
dataType:"json",
success:function(msg){
//alert(msg.gtlist.length);
var option = "";
option +="<option value=''>場地</option>";
for(var i=0;i<msg.mapList.length;i++){
option += "<option value='"+msg.mapList[i].id+"'>"+msg.mapList[i].name+"</option>";
}
$("select[name='"+target+"']").html(option);
}
});
}