$.ajax的success函数中,监听【多张图片全部加载成功】事件
2015-03-13 23:06
441 查看
<span style="font-style: normal;"><strong>$.ajax({ url : options.asynOptions.url, type : 'post', dataType : 'json', data : getAjaxData(options.asynOptions.form), success : function(data){ var html = '', allow = options.asynOptions.return, itemClass = options.itemClass, imageClass = options.imageClass, count = 0; for(var pro in data){ html += '<div class="'+itemClass+'">'; html += '<img class="'+imageClass+'" src="'+data[pro][allow[0]]+'" />'; html += '<span>'+data[pro][allow[1]]+'</span>'; html += '<span>'+data[pro][allow[2]]+'</span>'; html += '</div>'; count++; } $this.append(html); var $colsHeight = []; $("."+imageClass).load(function(){ count--; if(count == 0){ var itemWidth = getFullWith($("."+options.itemClass).eq(0)), cols = getColNumber($this,itemWidth); $("."+imageClass).each(function(i,img) { var iheight = getItemFullHeight($("." + itemClass).eq(i)); if (i < cols) { $colsHeight[i] = iheight; } else { var minH = Math.min.apply(null, $colsHeight); var minHIndex = $.inArray(minH, $colsHeight); $("." + itemClass).eq(i).css({ 'position': 'absolute', 'top': minH, 'left': $(".waterfall_item").eq(minHIndex).position().left }); $colsHeight[minHIndex] += iheight; } }); } }); } });</strong></span>
相关文章推荐
- 【Cocos2d-x游戏开发lua篇之基础】加载图片与设置按钮监听事件
- 推荐插件:imagesLoaded,监测图片加载情况并提供相应的事件(加载成功/失败)
- Store加载数据通过监听事件返回加载成功的结果
- 分享JavaScript监听全部Ajax请求事件的方法
- js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件,兼容各大主流浏览器 HTML特殊字符
- js 实现图片预加载 (js操作 Image对象属性complete ,事件onload 异步加载图片)
- Flex中加载多个Module之间的事件监听和触发
- 用microsoftAjax.js框架来进行事件监听
- stage监听键盘事件被另外的swf加载后失效的解决方法。
- htmlText中图片的事件监听
- javascript页面加载与事件监听函数
- asp.net Application_AcquireRequestState事件,导致Ajax客户端不能加载
- PV3D加载图片时的事件触发
- jQuery Howto: 如何快速创建一个AJAX的"加载"的图片效果
- Gridpanel数据加载成功后,触发事件,让表格第一行的数据显示在下面的formpanel
- ajax异步加载图片
- Flex中如何通过httpStatus事件检测Image控件载入图片是否成功的例子
- 当一个页面全部加载完才触发的事件
- 加载外部sound之监听加载事件