JS异步处理真是一个让人头疼的东西,尤其是AJAX这个玩意.刚开始为了方便我会将jquery ajax 这个属性这样设置 async: false
但是这样做问题很多,会让浏览器假死,好在ajax提供了一个defferd的新办法.

function makeJsonp(url, data) {
return $.ajax({
type: "POST",
data: data,
url: url,
dataType: "jsonp",
jsonp: "callback"
});
}

  

lunboDfd=makeJsonp(host+'homenews',data).done(function (result) {
$swiperContainer.children('.swiper-wrapper').html(produceHtml(result))
});

  

$.when(lunboDfd).done(function () {
var swiper = new Swiper('#swiperContainer', {
loop : true,
/!*spaceBetween: 10,*!/
centeredSlides: true,
autoplay: 2500,
autoplayDisableOnInteraction: false
});
});

  先监测ajax执行成功后,将html内容插入到页面里,之后在执行swiper轮播图,这样swiper才能正常执行.
这样写方便管理代码,可以把单独功能的代码写在另一个模块里,不用混写在一起,放到AJAX success成功函数里,

书写方便,回看也易懂.少了嵌套就是看到舒服

 


javascript 多个异步处理解决方法的更多相关文章

  1. JavaScript heap out of memory解决方法

    在 npm 打包的时候,node环境控制台报错了,JavaScript heap out of memory 解决方法如下: 不管你是angular还是其他的,找到 \node_modules\.bi ...

  2. 在使用VS过程中关于Javascript没有智能提示的解决方法

    问题:编写基本Script代码没有问题,但是在编写DOM代码时候没有智能提示.也就是在编写一般javascript代码时候没有问题,但是要写DOM代码的时候发现没有智能提示,如document等都需要 ...

  3. node 异步回调解决方法之yield

    先看如何使用 使用的npm包为genny,npm 安装genny,使用 node -harmony 文件(-harmony 为使用es6属性启动参数) 启动项目 var genny= require( ...

  4. javascript中跨域问题的解决方法汇总

    javascript中实现跨域的方式总结 第一种方式:jsonp请求:jsonp的原理是利用<script>标签的跨域特性,可以不受限制地从其他域中加载资源,类似的标签还有<img& ...

  5. 常见JS(JavaScript)冲突解决方法

    1.一般JS冲突解决办法 a.最容易出现的就是js的命名冲突 ①.变量名冲突 变量有全局变量和局部变量当全局变量变量和局部变量名称一致时,就会js冲突,由于变量传递数值或地址不同就会产生JavaScr ...

  6. Ajax异步获取html数据中包含js方法无效的解决方法

    页面上使用js写了一个获取后台数据的方法 function data() { var tab = $("#dic") $.ajax({ url: '../demo.ashx?met ...

  7. javascript常见的20个问题与解决方法

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. 百度编辑器ueditor 异步加载时,初始化没办法赋值bug解决方法

    百度编辑器ueditor 异步加载时,初始化没办法赋值bug解决方法 金刚 前端 ueditor 初始化 因项目中使用了百度编辑器——ueditor.整体来说性能还不错. 发现问题 我在做一个编辑页面 ...

  9. javascript使用for循环批量注册的事件不能正确获取索引值的解决方法

    今天遇到一个问题,那就是当使用for循环批量注册事件处理函数,然后最后通过事件处理函数获取当前元素的索引值的时候会失败,先看一段代码实例: <script type="text/jav ...

随机推荐

  1. Vue+Typescript中在Vue上挂载axios使用时报错

    Vue+Typescript中在Vue上挂载axios使用时报错 在vue项目开发过程中,为了方便在各个组件中调用axios,我们通常会在入口文件将axios挂载到vue原型身上,如下: main.t ...

  2. .NET Core 3.0预览版7中的ASP.NET Core和Blazor更新

    .NET Core 3.0 Preview 7现已推出,它包含一系列ASP.NET Core和Blazor的新更新. 以下是此预览中的新功能列表: 最新的Visual Studio预览包括.NET C ...

  3. springMVC(一) --前端控制器(DispatcherServlet)的作用

        SpringMVC是Spring中的模块,它实现了mvc设计模式的web框架,首先用户发出请求,请求到达SpringMVC的前端控制器(DispatcherServlet),前端控制器根据用户 ...

  4. mybatis学习笔记(三)

    mybatis增删改 概念: 功能:从应用程序角度出发,软件具有哪些功能: 业务:完成功能时的逻辑,对应service的一个方法: 事务:从数据库角度出发,完成业务时需要执行的SQL集合,统称一个事务 ...

  5. Assign the task HDU - 3974 (dfs序 + 线段树)

    有一家公司有N个员工(从1到N),公司里每个员工都有一个直接的老板(除了整个公司的领导).如果你是某人的直接老板,那个人就是你的下属,他的所有下属也都是你的下属.如果你是没有人的老板,那么你就没有下属 ...

  6. http客户端-性能比较系列-第二篇-多线程

    系列文章: 单线程性能测试:https://www.cnblogs.com/victor2302/p/11077208.html 多线程性能测试:https://www.cnblogs.com/vic ...

  7. 关于Java虚拟机运行时数据区域的总结

    Java虚拟机运行时数据区域 程序计数器(Program Counter) 程序计数器作为一个概念模型,这个是用来指示下一条需要执行的字节码指令在哪. Java的多线程实际上是通过线程轮转做到的,如果 ...

  8. laravel新项目报错 No application encryption key has been specified.

    解决办法, 若文件根目录下没有 .env 1..env.example 改名使用命令 copy 修改为 .env 2.使用命令 php artisan key:generate  获取密码,自动保存到 ...

  9. Git 实用技巧:git stash

    我们经常会遇到这样的情况: 正在dev分支开发新功能,做到一半时有人过来反馈一个bug,让马上解决,但是新功能做到了一半你又不想提交,这时就可以使用git stash命令先把当前进度保存起来.然后切换 ...

  10. Nginx总结(一)Linux如何安装Nginx

    以前写过一些Nginx的文章,但都是用到什么说什么,没有一个完整系统的总结.趁最近有时间,打算将Nginx相关的内容重新整理一下.nginx系列文章地址如下:https://www.cnblogs.c ...