发新贴  快速回复

js分页的callback怎么理解?

cnbleach
2015-01-08 16:53
 本帖最后由 cnbleach 于 2015-1-8 16:56 编辑 

aA[i].onclick 后的callback是怎么调用的?前面page()不是调用了一次callback,怎么没alert出来了

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
a{ margin:5px;}
</style>
<script>
window.onload = function(){
 
 page({
 
  id : 'div1',
  nowNum : 7,
  allNum : 10,
  callBack : function(now,all){
  
   alert('当前页:' + now +',总共页:'+all);
  
  }
 
 });
 
};
function page(opt){
 if(!opt.id){return false};
 
 var obj = document.getElementById(opt.id);
 
 var nowNum = opt.nowNum || 1;
 var allNum = opt.allNum || 5;
 var callBack = opt.callBack || function(){};
 
 if( nowNum>=4 && allNum>=6 ){
 
  var oA = document.createElement('a');
  oA.href = '#1';
  oA.innerHTML = '首页';
  obj.appendChild(oA);
 
 }
 
 if(nowNum>=2){
  var oA = document.createElement('a');
  oA.href = '#' + (nowNum - 1);
  oA.innerHTML = '上一页';
  obj.appendChild(oA);
 }
 
 if(allNum<=5){
  for(var i=1;i<=allNum;i++){
   var oA = document.createElement('a');
   oA.href = '#' + i;
   if(nowNum == i){
    oA.innerHTML = i;
   }
   else{
    oA.innerHTML = '['+ i +']';
   }
   obj.appendChild(oA);
  } 
 }
 else{
 
  for(var i=1;i<=5;i++){
   var oA = document.createElement('a');
   
   
   if(nowNum == 1 || nowNum == 2){
    
    oA.href = '#' + i;
    if(nowNum == i){
     oA.innerHTML = i;
    }
    else{
     oA.innerHTML = '['+ i +']';
    }
    
   }
   else if( (allNum - nowNum) == 0 || (allNum - nowNum) == 1 ){
   
    oA.href = '#' + (allNum - 5 + i);
    
    if((allNum - nowNum) == 0 && i==5){
     oA.innerHTML = (allNum - 5 + i);
    }
    else if((allNum - nowNum) == 1 && i==4){
     oA.innerHTML = (allNum - 5 + i);
    }
    else{
     oA.innerHTML = '['+ (allNum - 5 + i) +']';
    }
   
   }
   else{
    oA.href = '#' + (nowNum - 3 + i);
    
    if(i==3){
     oA.innerHTML = (nowNum - 3 + i);
    }
    else{
     oA.innerHTML = '['+ (nowNum - 3 + i) +']';
    }
   }
   obj.appendChild(oA);
   
  }
 
 }
 
 if( (allNum - nowNum) >= 1 ){
  var oA = document.createElement('a');
  oA.href = '#' + (nowNum + 1);
  oA.innerHTML = '下一页';
  obj.appendChild(oA);
 }
 
 if( (allNum - nowNum) >= 3 && allNum>=6 ){
 
  var oA = document.createElement('a');
  oA.href = '#' + allNum;
  oA.innerHTML = '尾页';
  obj.appendChild(oA);
 
 }
 
 callBack(nowNum,allNum);
 
 var aA = obj.getElementsByTagName('a');
 
 for(var i=0;i<aA.length;i++){
  aA[i].onclick = function(){
   
   var nowNum = parseInt(this.getAttribute('href').substring(1));
   
   obj.innerHTML = '';
   
   page({
   
    id : opt.id,
    nowNum : nowNum,
    allNum : allNum,
    callBack : callBack
   
   });
   
   return false;
   
  };
 }
}
</script>
</head>
<body>
<div id="div1">
 <!--<a href="#1">首页</a>
 <a href="#3">上一页</a>
 <a href="#2">[2]</a>
 <a href="#3">[3]</a>
 <a href="#4">4</a>
 <a href="#5">[5]</a>
 <a href="#6">[6]</a>
 <a href="#5">下一页</a>
 <a href="#10">尾页</a>-->
 
</div>
</body>
</html>

ghostdp
for(var i=0;i<aA.length;i++){
  aA.onclick = function(){这写的不对把aA是个集合啊

aA[i].onclick = 

2015-01-08 21:10  回复本帖
cnbleach
forum.php?mod=redirect&goto=findpost&pid=34646&ptid=11275
这写的不对把aA是个集合啊

aA.onclick =

复制错了,是aA[i],不明白那个callback是怎么调用的,怎么就弹出来了一个对话框,是因为设置了参数?
2015-01-09 22:07  回复本帖
ghostdp
forum.php?mod=redirect&goto=findpost&pid=34692&ptid=11275
复制错了,是aA,不明白那个callback是怎么调用的,怎么就弹出来了一个对话框,是因为设置了参数? ...

callBack : function(now,all){
  
   alert('当前页:' + now +',总共页:'+all);
  
  }是page的参数


这句接收参数
var callBack = opt.callBack || function(){};

那么这个变量callBack就是

 function(now,all){
  
   alert('当前页:' + now +',总共页:'+all);
  
  }

所以你下面调用
[i]   callBack : callBack
必然可以弹出
 alert('当前页:' + now +',总共页:'+all);

2015-01-10 12:57  回复本帖
cnbleach
forum.php?mod=redirect&goto=findpost&pid=34703&ptid=11275
callBack : function(now,all){
  
   alert('当前页:' + now +',总共页:'+all);


那这一句callBack(nowNum,allNum);
不是已经调用了这个函数么,应该在这里弹出来才是啊
2015-01-12 21:52  回复本帖
无为
forum.php?mod=redirect&goto=findpost&pid=34776&ptid=11275
那这一句callBack(nowNum,allNum);
不是已经调用了这个函数么,应该在这里弹出来才是啊
 ...

不是已经弹出来了么?难道你刷新页面的时候没有弹东西出来?

2015-01-12 22:05  回复本帖
cnbleach
 本帖最后由 cnbleach 于 2015-1-14 14:10 编辑 

forum.php?mod=redirect&goto=findpost&pid=34778&ptid=11275
不是已经弹出来了么?难道你刷新页面的时候没有弹东西出来?
是弹出来了,代码都看糊涂了, aA.onclick[i] 调用page里的callback时,里面callback的好像没有参数阿,要怎么调用才对?
(论坛打不出[],往[]里面添加字母i会自动消除)
2015-01-14 14:07  回复本帖
ghostdp
forum.php?mod=redirect&goto=findpost&pid=34904&ptid=11275
是弹出来了,代码都看糊涂了, aA.onclick 调用page里的callback时,里面callback的好像没有参数阿,要怎么 ...
callBack(nowNum,allNum);这里难道不是传参调用吗


aA.onclick 中调用的是 page函数,而callback函数作为回调函数,是在page函数中调用的
2015-01-14 14:14  回复本帖
无为
forum.php?mod=redirect&goto=findpost&pid=34904&ptid=11275
是弹出来了,代码都看糊涂了, aA.onclick 调用page里的callback时,里面callback的好像没有参数阿,要怎么 ...

你到底是遇到了什么问题? 具体想问什么呢?

你说的没有传参数,是指下面的这句话么?
callBack : callBack
这里前面的 callBack 怎么会没有参数呢?你要理解这里的两个 callBack 单词是什么意思,第一个是属性名称,第二个是一个变量,这个变量是上面定义的:
var callBack = opt.callBack || function(){};
而上面这里定义的 callBack ,它的值是引用的最上面 调用 page 时传进来的对象中的callBack函数,就是里面有alert的那里。


好好整理一下你的思路,把你的问题描述清楚,你是想要做什么?

2015-01-14 15:06  回复本帖
cnbleach
 本帖最后由 cnbleach 于 2015-1-15 14:43 编辑 

forum.php?mod=redirect&goto=findpost&pid=34916&ptid=11275
你到底是遇到了什么问题? 具体想问什么呢?

你说的没有传参数,是指下面的这句话么?

可能我没把问题描述清楚,我指的是当按钮aA调用page的时候,这时候的page里的callback的参数是什么?
第一次调用callback时,参数是nowNum,allNum,
当按钮aA调用callBack : callBack,第二个callback的nowNum,allNum是什么呢?

2015-01-15 14:32  回复本帖
无为
forum.php?mod=redirect&goto=findpost&pid=35348&ptid=11275
可能我没把问题描述清楚,我指的是当按钮aA调用page的时候,这时候的page里的callback的参数是什么?
第一 ...

亲,你确定你读懂这段代码了么? 

不论你点击哪一个 aA ,代码最终执行的都是你标红的那个 callBack , 你所说的那里只是调用 page 函数时的一个传参而已,而参数里的 callBack 是 page 函数上面定义过的一个变量。

如果你对这段代码很有疑问,而实际工作中确实需要用到它,请联系我们客服,表明你的身份,如果你是我们的 VIP 会员,我们会安排讲师在时间允许的情况下专门录制一段视频来为你解答一下这段代码。

2015-01-16 15:02  回复本帖
cnbleach
forum.php?mod=redirect&goto=findpost&pid=35453&ptid=11275
亲,你确定你读懂这段代码了么? 

不论你点击哪一个 aA ,代码最终执行的都是你标红的那个 callBack ,  ...

我又看了几遍代码,现在终于弄懂了,第二个callBack是一个参数,也是一个函数,把一个函数传递进去了,无为谢谢了
(我真的是VIP,花100大洋买的)
2015-01-16 22:30  回复本帖
无为
forum.php?mod=redirect&goto=findpost&pid=35489&ptid=11275
我又看了几遍代码,现在终于弄懂了,第二个callBack是一个参数,也是一个函数,把一个函数传递进去了,无 ...

我不是怀疑你,我意思是你跟客服确认登记一下。如果的确是不理解,我们可以专门录制视频为你解答。既然你花钱买了 vip ,我们当然有义务帮你把问题解答清楚。

2015-01-17 17:21  回复本帖
登录 后才可以发表回复