位置: 编程技术 - 正文

Jquery promise实现一张一张加载图片(jquery prototype)

编辑:rootadmin

推荐整理分享Jquery promise实现一张一张加载图片(jquery prototype),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:jquery中的prop,jquery prompt,jquery prop,jqueryprev,jquery prompt,jquery prompt,jquery prop,jquery propertychange,内容如对您有帮助,希望把文章链接给更多的朋友!

Promise是CommonJS的规范之一,拥有resolve、reject、done、fail、then等方法,能够帮助我们控制代码的流程,避免函数的多层嵌套。如今异步在web开发中越来越重要,对于开发人员来说,这种非线性执行的编程会让开发者觉得难以掌控,而Promise可以让我们更好地掌控代码的执行流程,jQuery等流行的js库都已经实现了这个对象,年底即将发布的ES6也将原生实现Promise。

在javascript设计模式实践之代理模式--图片预加载中用代理模式实现了图片预加载功能。

现在就更进一步,完成一个能够一张一张的连续图片加载的功能。

功能:

1.一张一张加载图片。

2.加载错误,超时后显示加载失败图片。

对于功能的要求,肯定会存在对加载状态事件的处理以及完成时回调函数的处理,这样不仅会造成代码上的混乱,甚至破坏各种原则,就不再用普通的方法去写了。针对这种状态通知的特点,比较合适采用promise架构进行处理,promise本质上就是订阅发布设计模式的一种,当前这个功能就用jquery自带的promise进行开发。

1.完成一个加载图片的代理创建函数,可以生成一个带有加载超时、失败、成功、取消监控能力的代理。

其中,通过以下的方式创建了一个Deferred对象

Deferred对象通过resolve方法触发完成事件,使用done方法响应完成事件。

加载成功时的完成事件。

Jquery promise实现一张一张加载图片(jquery prototype)

以及加载完成时的响应处理,就是把图片设到元素上,下面的代码是上面链式写法的拆解。

Defferred对象通过reject方法触发拒绝事件,使用fail方法响应拒绝事件,表示加载失败。

在加载超时,终止,异常时的拒绝事件。

以及加载失败时的响应处理,设置失败图片。

在代理函数的最后,返回deferred的promise对象,用于给调用的地方监控加载的完成和失败态,以便于下一张图片的加载。

return dfd.promise();

2.一张一张的连续加载

做一个loadOneByOne的加载递归函数。

内部先创建一个加载代理,在代理加载完图片,不管是成功还是失败后,递归调用loadOneByOne函数加载下一张图片。

关键就在于代理函数返回的promise对象,使用.always方法可在加载完成后(成功或失败)进行loadOneByOne递归调用加载下一张。

至此完成。

采用了promise模式后,callback函数不见了,维护状态的函数和内部变量也不见了,代码更清晰简单,使得代理函数和本地函数之间的一致性得到保护。

完整代码:

以jQuery中$.Deferred对象为例讲解promise对象是如何处理异步问题 Promises是一种令代码异步行为更加优雅的抽象,它很有可能是JavaScript的下一个编程范式,一个Promise即表示任务结果,无论该任务是否完成。在一些现代

jquery动画效果学习笔记(8种效果) 1、元素的显示和隐藏display:none;隐藏display:block;显示简单显示和隐藏方法a)show()显示b)hide()隐藏c)toggle()开关,显示则隐藏,隐藏则显示scripttype="text/javascrip

jquery实现九宫格大转盘抽奖 下面我们来分享一个九宫格抽奖特效特效说明:一款jQuery九宫格大转盘抽奖代码网页特效,点击抽奖按钮开始随机抽奖选择奖品,可设置起点位置、奖

标签: jquery prototype

本文链接地址:https://www.jiuchutong.com/biancheng/370503.html 转载请保留说明!

上一篇:jquery转盘抽奖功能实现(h5抽奖转盘)

下一篇:以jQuery中$.Deferred对象为例讲解promise对象是如何处理异步问题(jquery的deferred)

  • 视同内销增值税怎么申报
  • 什么是边际税率高
  • 广告制作要交文化部门吗
  • 养老保险滞纳金最高限额规定
  • 个人写的收据要留身份证复印件吗
  • 原始凭证分割单样本
  • 退回以前年度工资怎么做账
  • 视同内销补税的财务处理
  • 资产减值确定计量原则包括哪些
  • 账簿登记的基本要求
  • 政府搬迁补偿款记资本公积
  • 库存产品亏本销售账务处理
  • 离职未收回货款要我承担
  • 装修项目展示厅费用支出列什么科目?
  • 支付宝已经支付的钱怎么退回来
  • 公司注销后还会有事吗
  • 用现金缴纳海关增值税能否抵扣?
  • 学校有没有纳税人识别号
  • 信用卡消费凭证
  • 退税可以分批吗
  • 公司办事处人员配置标准最新
  • 苹果手机zm
  • 个体工商户未给员工缴纳社保
  • 主营业务收入平均增长率计算公式近两年
  • 一次性付一年的房租要摊销吗
  • 长期停工的影响
  • 企业发生的哪些费用可以结转
  • 交暖气费可以开单位发票吗
  • 非营利性组织收到政府拨款转出给其他部门怎么做账
  • 交易性金融资产的账务处理
  • 业务招待费会计分录
  • 再保险业务核算方法
  • 福利部门领用原材料进项税额可以抵扣吗
  • 结转代销成本
  • vue docx-preview实现docx文件在线预览
  • php计算圆的周长和面积代码
  • 小规模纳税人的企业所得税怎么算
  • 购买的无形资产交印花税吗?
  • 固定资产报废计入资产处置损益吗
  • 厂房办公用品费用怎么算
  • 怎么计算土地增值税收入
  • 会计记错账有什么后果
  • 存货跌价准备可以转回吗?
  • 职工教育经费还有什么经费
  • 工资汇算清缴前发
  • 高速过路费抵扣增值税
  • 工会经费滞纳金怎么算
  • 暂估入库产品销售结转成本
  • 销项发票能不能退税
  • 团体意外保险能赔多少钱
  • 长期股权投资损益调整怎么回事
  • 什么是现金流量表分析的重点
  • mysql数据库优化面试题
  • mysql数据库迁移到达梦
  • 如何查看solaris版本
  • windows8休眠如何唤醒
  • ubuntu系统中文
  • win7卸载系统软件
  • vnc for linux
  • winxp网络设置在哪
  • mac声音怎么调大
  • iusb3mon.exe是什么
  • win10如何禁用windows defender
  • zmweb.exe是什么进程
  • win10推送升级win11
  • 简单谈谈你的入党动机
  • Unity3D游戏开发(第2版)
  • javascript运算
  • 怎么使用vue和axios连接后端
  • vs开发web教程
  • 置顶的朋友圈屏蔽的人能看到吗
  • JavaScript中的数据类型分为两大类
  • 置顶怎么折叠起来
  • python 循环太慢
  • js link global
  • 电子税务局季度利润表本月数
  • 企业所得税率2023年
  • 深圳土地增值税清算规程
  • 企业间借款合同印花税怎么交
  • 增值税可以抵扣多少
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设