为什么这个ajax代码会延迟
Why this ajax code got delay?
我正在尝试制作搜索地址表单。
这就是结构和方法。
search_address.html:
<form id="search_address_form" onSubmit="sendAddress(); return false;">
<input id="input_address" class="input_address" name="input_address" type="text" placeholder="example: blahblahblah"/>
</form>
<div id="addressList_layer" class="addressList_layer">
<script>
input_address = document.getElementById('input_address');
input_address.addEventListener('keydown',function(){
sendAddress();
});
function sendAddress(){
xhrDocOpen('./php/search_address.php?searchingFor='+inputAddress_data.value,'addressList_layer','get');
return false;
}
</script>
search_address.php:
<?php
include_once('./config.php');
extract($_GET);
echo ($searchingFor);
?>
此代码运行良好。
但它运行有点延迟。。。
我的意思是,例如,
input_address.value : "1"
addressList_layer.value : ""
input_address.value : "123"
addressList_layer.value : "12"
input_address.value : "123456"
addressList_layer.value : "12345"
input_address.value : "123abc"
addressList_layer.value : "123ab"
像这样,addressList_layer显示的总是比input_address延迟一步。
我不知道为什么。。。
有人能猜出这种情况的原因并给我解决方案吗?
ps。xhrDocOpen()是…
var xhr = new XMLHttpRequest();
function xhrDocOpen(doc,placeID,method){
xhr.onreadystatechange=function(){
if(xhr.readyState==4 && xhr.status==200){
document.getElementById(placeID).innerHTML=xhr.responseText;
}
xhr.open(method,doc,true);
xhr.send('');
}
如果您试图使用"keydown"事件,这是常见的问题。
只要尝试将其更改为"keyup",它就会工作。
相关文章:
- 如何在有延迟的情况下对两个代码进行积分
- 延迟代码执行,直到下载完成
- 在单击下一个按钮之前,在JavaScript代码中添加5秒的延迟
- 如何在不停止HTML呈现的情况下放置停止代码的延迟
- 是否有一个Javascript函数可以使代码在运行时延迟
- 按顺序调用javascript代码的替代方法,其间有延迟
- 在一段真实代码中延迟
- 在下面的 Angular Material 代码中了解此延迟语法及其用途
- jquery延迟代码的执行
- 如何在下面的代码中添加setTimeout来延迟渐变动画
- 在不使用外部库的情况下为JavaScript代码添加简单延迟
- 为什么这个ajax代码会延迟
- 延迟Javascript/Java中函数内的代码执行
- 在异步代码块中处理的多个ajax延迟调用的数组,后面是同步的最终代码块
- 执行代码,但延迟'return'JS中的函数
- Javascript代码执行延迟
- “setTimeout"与“debounce"插件-延迟对事件的代码执行
- Javascript循环与延迟代码修复
- 尝试使用链接延迟,但我尝试的任何代码都不工作
- Jquery延迟像警告框一样停止代码