主意及其回调函数用法实例,增多回调函数

在开垦项目中,将前台的值传给后台,临时的JSP表单中的值有一七个,也可能有一切的值,即使此时一个个传,必定不是很好的点子,所以选择jQuery提供的表单系列化方法,能够很好的解决那一个主题材料,同偶尔候能够封装成通用的函数,实践成功足以调用各自的回调函数,达成各自的法力。

本文实例陈诉了jQuery回调方法运用。分享给大家供我们参照他事他说加以考察,具体如下:

正文实例陈诉了jQuery的load()方法及其回调函数用法。分享给我们供大家参谋。具体如下:

主意及其回调函数用法实例,增多回调函数。正文实例汇报了jQuery插件扩充的情势。分享给大家供大家参照他事他说加以考察,具体如下:

代码如下:

艺术参数带有function方法,何况施行完后把计算的多少重回

下边包车型地铁js代码演示了jQuery的load()方法的采纳,并演示了带回调函数(callback)的load方法的应用

<script language="javascript" type="text/javascript">
function doSomething(callback) {
  // … 
  // Call the callback
  callback('stuff', 'goes', 'here'); // 给callback赋值,callback是个函数变量
}
function foo1(a, b, c) {
  // I'm the callback
  alert(a + " " + b + " " + c);
}
doSomething(foo1); // foo1函数将使用callback函数中的数据 stuff goes here
var foo2 = function(a,b,c) {
  // I'm the callback
  alert(a + " " + b + " " + c);
}
doSomething(foo2); // foo2函数将使用callback函数中的数据 stuff goes here
doSomething(function(a,b,c){
  alert(a + " " + b + " " + c); // function函数将使用callback函数中的数据 stuff goes here
});
</script>
function queryUserInfo(actionUrl,formId,fun){ 
var params=new Object(); //声明数组 
$.each($("#"+formId).serializeArray(),function(index,param){ 
params[param.name] = param.value; //序列化表单 
}); 
params['time']=new Date(); //1 
$.ajax( { 
url : basePath+actionUrl, 
data : params,//没有1,可以这样写("#"+formId).serializeArray() 
type : 'POST', 
dataType:'json', 
async: false,//表示同步,等待服务端返回数据,才会执行后面的代码 
success : function(obj) { 
fun(actionUrl,formId,obj); 
}, 
error: function() { 
alert("访问异常"); 
} 
}); 
}
function a1(p){ // p 为调用此方法传递的object对象
  var callback = p?p.callback:null; // 获取参数对象中的回调方法
  if($.isFunction(p.callback)){ // 如果有回调方法
    callback("123"); // 返回一个计算后的数据,方便回调方法使用它
  }
}
function a2(data){
  console.info(data);
}
// 调用a1方法
a1({callback:function(callbackData){ // 参数为一个object对象,其中key为callback的val是一个function方法,并且需要a1方法计算得到的值
  // a1方法执行完成之后 进入回调用法,接着调用a2方法
  a2(callbackData);
}});
<!DOCTYPE html>
<html>
<head>
<script src="js/jquery.min.js">
</script>
<script>
$(document).ready(function(){
 $("button").click(function(){
  $("#div1").load("demo_test.txt",function(responseTxt,statusTxt,xhr){
   if(statusTxt=="success")
    alert("External content loaded successfully!");
   if(statusTxt=="error")
    alert("Error: "+xhr.status+": "+xhr.statusText);
  });
 });
});
</script>
</head>
<body>
<div id="div1"><h2>Let jQuery AJAX Change This Text</h2></div>
<button>Get External Content</button>
</body>
</html>

callback这几个参数必须是函数才使得。手艺起到回调的效果与利益。

另一种艺术:

这么会实践完a1办法后,况且得到a1主意所总结的值,然后将此数量传到a2措施举办实践。

但愿本文所述对我们的jQuery程序设计有所扶助。

<script language="javascript" type="text/javascript">
function doSomething(callback) {
  // … 
  // Call the callback
  if(typeof callback === 'function'){
    callback('stuff', 'goes', 'here'); // 给callback赋值,callback是个函数变量
  }else{
    alert('jb51.net');
  }
}
function foo1(a, b, c) {
  // I'm the callback
  alert(a + " " + b + " " + c);
}
doSomething(foo1); // foo1函数将使用callback函数中的数据 stuff goes here
var foo2 = function(a,b,c) {
  // I'm the callback
  alert(a + " " + b + " " + c);
}
doSomething(foo2); // foo2函数将使用callback函数中的数据 stuff goes here
doSomething(function(a,b,c){
  alert(a + " " + b + " " + c); // function函数将使用callback函数中的数据 stuff goes here
});
var foo3 = 'a';
doSomething(foo3);
</script>
function setUserInfo(actionUrl,userid,username,fun){ 
var params=new Object(); //声明数组 
params['user.id']=userid; 
params['user.name']=username; 
$.ajax( { 
url : actionUrl, 
data : params,//没有1,可以这样写("#"+formId).serializeArray() 
type : 'POST', 
dataType:'json', 
async: false,//表示同步,等待服务端返回数据,才会执行后面的代码 
success : function(obj) { 
fun(actionUrl,formId,obj);//调用回调的函数 
}, 
error: function() { 
alert("访问异常"); 
} 
}); 
}

越多关于jQuery相关内容感兴趣的读者可查看本站专项论题:《jQuery常用插件及用法计算》、《jQuery扩张技巧计算》、《jQuery切换特效与才具总括》、《jQuery遍历算法与才能总括》、《jQuery常见卓越特效汇总》及《jquery接纳器用法总计》

你只怕感兴趣的篇章:

  • jQuery回调函数的概念及用法实例
  • 行使jQuery中的when完成多少个AJAX恳求对应单个回调的事例分享
  • 从零学jquery之如何采纳回调函数
  • jQuery
    AJAX回调函数this指向难点
  • 主意及其回调函数用法实例,增多回调函数。jQuery Ajax Post
    回调函数不实施难点的缓慢解决措施
  • 浅谈jquery回调函数callback的使用
  • jquery类别化表单以及回调函数的利用示例
  • jquery Deferred
    快捷化解异步回调的主题素材
  • jQuery插件扩大实例【加多回调函数】
  • jQuery回调方法运用示例

foo3不是函数的时候,弹出jb51.net

您恐怕感兴趣的稿子:

  • jQuery回调函数的概念及用法实例
  • 应用jQuery中的when达成多少个AJAX要求对应单个回调的例子共享
  • 从零学jquery之如何运用回调函数
  • jQuery
    AJAX回调函数this指向难题
  • jQuery Ajax Post
    回调函数不实施难题的化解措施
  • jQuery的load()方法及其回调函数用法实例
  • 浅谈jquery回调函数callback的行使
  • jquery Deferred
    快捷化解异步回调的标题
  • jQuery插件扩充实例【增加回调函数】
  • jQuery回调方法运用示例

瞩望本文所述对我们jQuery程序设计有着帮助。

jQuery实例

你也许感兴趣的篇章:

  • jQuery回调函数的定义及用法实例
  • 选拔jQuery中的when达成四个AJAX央求对应单个回调的例子分享
  • 从零学jquery之怎样利用回调函数
  • jQuery
    AJAX回调函数this指向难题
  • 皇家赌场手机版,jQuery Ajax Post
    回调函数不实践难点的缓和方式
  • jQuery的load()方法及其回调函数用法实例
  • 浅谈jquery回调函数callback的施用
  • jquery系列化表单以及回调函数的行使示例
  • jquery Deferred
    连忙解决异步回调的难点
  • jQuery插件扩张实例【加多回调函数】

原函数

$.fn.citySelect=function(settings)

增加回调

$.fn.citySelect=function(settings, changeHandle) // 添加回调函数changeHandle

给回调函数赋值

//选项变动赋值事件
var selectChange = function (areaType) { 
  if(typeof changeHandle === 'function'){ // 判断callback是否是函数
    var prov_id = prov_obj.get(0).selectedIndex;
    var city_id = city_obj.get(0).selectedIndex;
    var dist_id = dist_obj.get(0).selectedIndex;
    if(!settings.required){
      prov_id--;
      city_id--;
      dist_id--;
    };
    if(dist_id<0){
      var data = {
        prov: city_json.citylist[prov_id].p,
        city: city_json.citylist[prov_id].c[city_id].n,
        dist: null
      };
    }else{
      var data = {
        prov: city_json.citylist[prov_id].p,
        city: city_json.citylist[prov_id].c[city_id].n,
        dist: city_json.citylist[prov_id].c[city_id].a[dist_id].s
      };
    }
    changeHandle(data, areaType); // 返回两个处理好的数据
  }
};

获取省市县数量data以及触发的change事件类型areaType

// 选择省份时发生事件
prov_obj.bind("change",function(){
    cityStart();
    selectChange('prov'); // 返回数据
});
// 选择市级时发生事件
city_obj.bind("change",function(){
    distStart();
    selectChange('city'); // 返回数据
});
// 选择区级时发生事件
dist_obj.bind("change",function(){
    selectChange('dist'); // 返回数据
});

在各种事件中试行

前端选择

$("#s_city").citySelect({
  prov: "江苏省",
  city: "宿迁市",
  dist: "宿城区",
  nodata: "none"
},
function(data, type) {
  selectAgent(data.city, data.dist);
});

动用回调回来的data数据,用于selectAgent函数中

function selectAgent(city,district){
    $.ajax({
      type:"POST",
      url:"{sh::U('Index/ajax',array('todo'=>'getagent'))}",
      data:"city="+city+"&district="+district,
      success:function(json){
        json = JSON.parse(json);
        opt_str = "<option value=''>-请选择-</option>"
        if(json.status == 1){
          $.each(json.data,function(index,con){
            opt_str += "<option value="+con.id+">"+con.name+" 电话:"+con.tel+"</option>"
          })
        }
        $('#agent_id').html(opt_str);
      }
    });
}

去ajax获取相应的代理商数据。

改建插件实现。

更加的多关于jQuery相关内容感兴趣的读者可查阅本站专项论题:《jQuery常用插件及用法计算》、《jQuery扩张技术总计》、《jQuery切换特效与技艺计算》、《jQuery遍历算法与手艺总计》、《jQuery常见非凡特效汇总》、《jQuery动画与特成效法计算》及《jquery选拔器用法总结》

指望本文所述对大家jQuery程序设计有着扶助。

您大概感兴趣的篇章:

  • jQuery回调函数的概念及用法实例
  • 行使jQuery中的when达成多个AJAX哀告对应单个回调的事例分享
  • 从零学jquery之如何选用回调函数
  • jQuery
    AJAX回调函数this指向难点
  • jQuery Ajax Post
    回调函数不试行难点的缓和措施
  • jQuery的load()方法及其回调函数用法实例
  • 浅谈jquery回调函数callback的选择
  • jquery连串化表单以及回调函数的运用示例
  • jquery Deferred
    快捷消除异步回调的难点
  • jQuery回调方法运用示例

Leave a Comment.