猿问

在线等,挺急的!知乎看到的一个题求指导!

某个应用模块由文本框input,以及按钮A,按钮B组成。点击按钮A,会向地址urlA发出一个ajax请求,并将返回的字符串填充到input中(覆盖input中原有的数据),点击按钮B,会向地址urlB发出一个ajax请求,并将返回的字符串填充到input中(覆盖input中原有的数据)。
当用户依次点击按钮A、B的时候,预期的效果是input依次被urlA、urlB返回的数据填充,但是由于到urlA的请求返回比较慢,导致urlB返回的数据被urlA返回的数据覆盖了,与用户预期的顺序不一致。
请问如何设计代码,解决这个问题?
慕虎7371278
浏览 227回答 2
2回答

一只萌萌小番薯

ajaxA和ajaxB用同一个回调函数。varresponse={}functioncallback(data,id){response[id]=dataif(response.a){inputA.value=response.a}if(response.a&&response.b){inputB.value=response.b}}如果b比a先回来,input的内容不会变,A再回来的时候会两个依次显示,当然,在显示B的时候建议加一个延迟,不然A的立马被覆盖了如果a比b先回来,input先显示A再显示B

宝慕林4294392

唯一的解决方案,预取数据。在第一次请求完成前,已预取所有请求响应数据。那么当后续请求发送时,直接使用预取数据即可。此解决方案仅适合此题,并不一定适用于大多数实际场景。其他的方案,如请求时阻止其他请求,或者增加请求队列等,都改变了此题原有题意,但却是实际场景中常见的解决方案。
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答