最近做项目遇到用ajax从数据库取值,当把值放进数组之后得到的是空值,因为js是同步的,只能走单线程,ajax是异步的。
一开始的解决办法是将ajax设置成同步
即加一个属性
async: false
但是这种方法只在火狐浏览器有效,谷歌的说法是不提倡设置为同步,同一个页面打开第二次便会出错。
后来查资料,写了一种方法,测试在谷歌有效,直接贴代码
function getData3(){ var defer = $.Deferred(); $.ajax({ url : 'get_meal_list.html', success: function(data){ data.forEach(function(list) { var meal = {name: list.list, restaurant: list.restaurant, meal: list.meal, price: list.price}; meal_list = JSON.parse(localStorage.getItem("meal_list")) || []; meal_list.push(meal); }) } }); return defer.promise(); } function get_data(){ $.when(getData3()).done(function(data){ localStorage.removeItem('meal_list'); localStorage.setItem('meal_list', JSON.stringify(meal_list)); }); console.log(localStorage.getItem('meal_list')) }
重点在于第二段函数$.when().then,意义是上一个执行完之后执行执行,这样可以成功的得到meal_list
我之前的写法
function get_all_meal_list(){ $.ajaxSettings.async = false; var meal_list=[]; localStorage.removeItem('meal_list'); $.ajax({url:"get_meal_list.html",success:function(data){ data.forEach(function(list){ var meal={name:list.list,restaurant:list.restaurant,meal:list.meal,price:list.price}; meal_list = JSON.parse(localStorage.getItem("meal_list")) || []; meal_list.push(meal); localStorage.removeItem('meal_list'); localStorage.setItem('meal_list', JSON.stringify(meal_list)); console.log(localStorage.getItem('meal_list')) }) }}); }
这样的话在另一而函数调用name_list得到的是空值,简直无语了
相关推荐
本文实例分析了ajax请求之返回数据的顺序问题。分享给大家供大家参考,具体如下: ajax请求一个url,php后端处理后,数组为如下格式: 代码如下:$a = array( ‘-1’=> 10 ,’-3′ => 2, ‘0’ => ‘5’ ,’-2′ => ...
如果非要返回结果的话,将ajax 中的参数 async 改为 false,即为同顺序执行,如下实现,即可返回到结果。 不过在非必要的情况下,不推荐此种做法 代码如下: function(url,params){ var outdata; $.ajax({ type : ...
1. 引言 在上一篇文章《如何确保JavaScript的执行顺序 – 之jQuery.html深度分析》中,我们揭示了jQuery.html函数之所以能在各种浏览器下保持动态JS顺序执行,其秘密在于 – 同步AJAX获取外部JavaScript。...
比如执行懒加载时候,onscroll 事件触发多次事件时候会调用多次 ajax 回调事件,由于每个事件返回先后次序并不能保证和触发前一致,所以在数据响应返回后所添加的数据顺序就很在 push 到数组上顺序不一致。...
在《浏览器环境下JavaScript脚本加载与执行探析之defer与async特性》中,我们研究了延迟脚本(defer)和异步脚本(async)的执行时机、浏览器支持情况、浏览器bug以及其他的细节问题。而除了defer和async特性,动态脚本...
13/13.4.2.html 避免拒绝服务攻击(DoS攻击) 13/13.5.2.html 因浏览器而异的字符串连接操作性能差异范例 13/13.5.3.html 按需载入JavaScript代码范例 13/hello.js 用于动态载入的js文件 ...
ocSteps 是一个JavaScript异步执行辅助工具,主要用于支持 Node.js 中的大量异步API以及操作,以及前端浏览器里的异步任务(例如Ajax)。如果你听说过“回调地狱”这个词,那么,__ocSteps__ 的用途就很好解释了:...
一、同一个对象可以发送多个请求,按顺序执行请求,有简单的超时机制,httpXMLRequest对象复用,无序的可以建立多个对象发送请求来实现; 二、兼容IE,FF,支持同步、异步请求; 三、测试通过:IE6+,FireFox2.0; ...
之前一直在写JQUERY代码的时候遇到AJAX加载数据都需要考虑代码运行顺序问题。最近的项目用了到AJAX同步。这个同步的意思是当JS代码加载到当前AJAX的时候会把页面里所有的代码停止加载,页面出去假死状态,当这个AJAX...
按顺序使用 jQuery 的延迟。 Deferreds 使用 promise 模式,对于延迟某个进程完成后要执行的任务很有用。 例如,处理从 AJAX 调用返回的数据。 有时需要一个接一个地做一系列的延迟任务; 每个仅在前一个完成后执行...
JavaScript code 代码如下: function existProduct(obj){ var productname = escape(obj.val()); $.getJSON(“../product/searchProductByName.action”,datat,function(data){ var falg; falg = data[0][...
为什么需要用到同步,因为有时候我们给一个提交按钮注册提交表单数据的时候,在提交动作之前会进行一系列的异步ajax请求操作,但是页面js代码会按顺序从上往下面执行,如果你在这过程中进行了异步操作,那么获取不到...
这个jQuery插件创建了一种简单的方法来排队ajax请求,使它们能够按顺序执行,但仍异步运行。 当由于不安全/破坏性的POST / PUT / DELETE请求而试图处理应用程序中的竞争条件时,这可能非常有用。 例如,采取以下...
addressbook.war JavaScript+XML实现通讯录的工程文件(可以直接在Tomcat下发布运行)。 addressbook.xml 记录通讯录的XML文件。 第14章(\c14) 示例描述:介绍JavaScript与Microsoft Office互操作的方法。 ...
多个ajax请求相互依赖,必须有先后顺序。 多个请求被同时发送,只需要最后一个请求。 1.情况1-多个ajax请求同时发送,相互无依赖 ajaxQueue1文件夹 ajaxQueue-requireJS //为符合AMD规范的文件,可以直接作为...
之前一直在写JQUERY代码的时候遇到AJAX加载数据都需要考虑代码运行顺序问题。最近的项目用了到AJAX同步。这个同步的意思是当JS代码加载到当前AJAX的时候会把页面里所有的代码停止加载,页面出去假死状态,当这个AJAX...
本文实例讲述了javascript异步处理与Jquery deferred对象用法。分享给大家供大家参考,具体如下: 这是项目组老大整理的一些... Ajax调用完成后执行的逻辑可以写成函数作为参数传递给Deffered对象的done(), fail(), a
内容索引:脚本资源,Ajax/JavaScript,多线程 JavaScript多线程函数库,它的意思是说可以让你同时执行多个JS函数。 一般我们都会遇到JS出现提示,脚本正在运行,因些就JS来说,它同时只能执行一个函数,一个一个按...
由于js执行顺序是顺序执行的,为提高页面相应速度,一般做法是在onload中只画页面,一些事件的绑定函数,ajax方法等可延后书写。 二、响应速度分析 1.借助工具进行分析 各大浏览器的开发者工具(最喜欢使用火狐)...