新手提问： js 如何处理这种情况

[kaiwei]

设想用户在网页点击一个按钮，向后台发送一个请求，例如是想要些数据 A 显示在前台，但是时间有点久，她就点击了另外一个按钮，请求显示数据 B 。 B 很快就返回并显示。此时 A 也到了。问 A 会覆盖 B 吗？（假定想让它们在同一个 div 里显示）。如果会覆盖的话，如何才能让 A 不覆盖 B 。如果不会覆盖的话，这是什么原因。多谢！

[FrankFang128]

会覆盖。不想覆盖就加一个序列号，让你知道 A 和 B 是不用的。然后 div 只接受最新的序列号的内容。

[FrankFang128]

* 让你知道 A 和 B 是不同的

[IamJ]

用一个标识变量解决

[imn1]

用添加而不是改写
str+=A
str+=B

[kaiwei]

@FrankFang128 这个序列号怎么实现？在请求里加上？然后后台返回的时候把它也带上？同时前台有个号码记录最新的序列号应该是几。如果后台返回的号比前台这个号小，就直接忽略。是这样吗？

[kaiwei]

@IamJ 能否具体说明 或者出处？多谢！

[FrankFang128]

@kaiwei 恩，请求要把序列号回传。

[FrankFang128]

方案 2 ：每次请求上把上一个请求 abort 掉。这样即使上一个返回了，浏览器也不要了。

[FrankFang128]

方案 3 ：这一次请求没有结束，就不要发起下一次请求。

[FrankFang128]

方案二最好。

[mcfog]

加遮罩层显示 loading 来阻止用户做其他操作也是一种常见的方案

[SilentDepth]

通常用户界面需要什么东西让用户知道后台有任务在跑，例如 @mcfog 说的加个 Loading 层。如果一次请求的数据并不是一定要显示出来，@FrankFang128 的方案 2 最好。

[sagnitude]

补充一下，我觉得保险的话，在发新的请求的时候楼上提到的这些都是要做的：

1. 尚未发送的请求，取消发送（在发送方法里检查 timestamp ）
2. 已经发送正在等待返回的， abort
3. 对于请求已经结束，正在处理数据的，用唯一的标识符，在数据处理完的时候拒绝过时的请求的数据
4. 加 loading 屏幕

如果只用其中一种或者若干种，还是有风险的，

因为有时候请求数据的处理是很重的，我经常请求一个数兆的 JSON 文件，然后画到 webgl canvas 里，这时候 JSON 处理根本无法取消，三角化和 geometry 生成也很难取消，只能做多重保险。

再补充一下，在 javascript 里，序列号也可以不用加在请求里，也不用服务器返回。由于 js 的回调机制，回调结束之前，那个函数的 scope 仍然是有效的，可以用局部变量和全局变量来做。

我写了一个简单的例子： https://gist.github.com/sagnitude/b0642604fd1911e016b4

核心的代码是这样：

function sendRequest() {
var timestamp = (new Date()).getTime();

window.lastRequestTimeStamp = timestamp;

Request.Dispatch(params, function(result) {
if (timestamp == window.lastRequestTimeStamp) {
//do something
console.log("success! " + timestamp);
}
});
}