JS来大姨妈了? javascript事件延迟 解决方案 » 免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货 JS代码没有高亮显示,重发一遍.......<html><head><meta http-equiv="content-type" content="text/html; charset=utf-8" /><script type="text/javascript">//清空补全表单function clearFill(){ var ul=$("showRes"); if(len=ul.childNodes.length) { //window.alert(len); for(var i=len-1; i>=0; i--) { ul.removeChild(ul.childNodes[i]); } ul.style.display="none"; } }//创建XHRfunction getXMLHttpRequest(){ var xmlhttp=null; if(window.ActiveXObject) { xmlhttp = new ActiveXObject("Microsoft.XMLHttp"); } else { xmlhttp=new XMLHttpRequest(); } return xmlhttp;}//发送AJAX查询function query(type){ var url="/ciba/niujin-alpha/process.php"; //查询结果 if(type==1) { var data="?enword="+$('enWord').value+"&type="+type+"&rand="+Math.random(); var en=$('enWord').value; //$('enWord').value=""; } //发送Ajax补全 else if(type==2) { var data="?enword="+$('enWord').value+"&type="+type+"&rand="+Math.random(); var en=$('enWord').value; } //window.alert(type); xmlhttp=getXMLHttpRequest(); if (xmlhttp) { xmlhttp.open("get", url+data,true); //window.alert(url+data); xmlhttp.onreadystatechange=function() { //window.alert(xmlhttp.readyState); if (xmlhttp.readyState==4 && xmlhttp.status==200) { var res=xmlhttp.responseText; res=eval("("+res+")"); //window.alert(res.flag); if(res.flag==1) { words= res.result; //window.alert(words.length); item=''; for(i in words) { item += "<p style = ' border: 1px solid gray; width:650px; background-color:grey; color: #000090;'>"+words[i]+"<p>"; } $("chWord").innerHTML= "<span style='color:#a00000;'>"+en+"</span>"+":<br /> "+item; } else if(res.flag==2) { var parent=document.getElementById("showRes"); var result=res.result; clearFill(); for(i in result) { var text=document.createTextNode(result[i]); var li=document.createElement("li"); li.appendChild(text); parent.appendChild(li); li.onmouseover = function(){ this.className = "mouseOver" ; //鼠标指针经过时高亮 } li.onmouseout = function(){ this.className = "mouseOut" ; //鼠标指针离开时恢复原样 } li.onclick = function(){ //用户单击某个匹配项时、设置输入框为该项的值 $("enWord").value = this.firstChild.nodeValue; query(1); clearFill(); //同时清除提示框 } } parent.style.display="block"; } } } xmlhttp.send(null); }}//捕捉回车键,如果是,进行查询function sendQuery(event){ var ul=$("showRes"); if(ul.style.display=="block") { ul.style.display="none"; } query(1); return false;}//补全时,发送ajax查询function sendFill(event){ var val=$("enWord").value; if(val.length >=2 ) { query(2); }}UlIndex=0;function send(event){ //当检测到按下的是回车键时 if(event.keyCode == 13) { sendQuery(event); } //当检测到按下的是a-z A-Z时 else if(event.keyCode>=65 && event.keyCode<=90 || event.keyCode>=97&&event.keyCode<=122) { sendFill(event); } //当检测到按下的是向下键时 else if(event.keyCode == 40 || event.keyCode == 39) { if($("showRes").hasChildNodes()) { var items = $("showRes").childNodes; var len = items.length; //window.alert(len); if(len>0) { if((UlIndex++) >= len){UlIndex = len;} //window.alert(items[UlIndex].firstChild.nodeValue); //items[UlIndex%len].onfocus = function(){this.style.backgroundColor="#aabbcc";} //event.target.style.background-color="#aabbcc"; $("enWord").value = items[UlIndex%len].firstChild.nodeValue; } if(event.keyCode==39) { sendQuery(); } } } //当检测到按下的是向上键时 else if(event.keyCode == 38 || event.keyCode == 39) { if($("showRes").hasChildNodes()) { var items = $("showRes").childNodes; var len = items.length; if(len>0) { if((UlIndex--) <= 0){UlIndex = 0;} //items[((--UlIndex)%len)].style.background-color="#aabbcc"; $("enWord").value = items[(UlIndex%len)].firstChild.nodeValue; } if(event.keyCode==39) { sendQuery(); } } } else if(event.keyCode==8) { sendFill(); if($("enWord").value.length<=1) { clearFill(); } }}//清空输入框function clearContent(){ $("enWord").value=""; return false;}function $(id){ return document.getElementById(id);}window.onload = function(){ $("enWord").setAttribute("autocomplete", "off"); $("enWord").focus();}</script><style rel="stylesheet" type="text/css">#outer{margin-left: 400px;}#up{margin-top:5px;}#his{color:gray; font-size:16px;}#showRes{ background-color:white; border: 1px solid gray; width:650px; display:none; list-style: none; margin: 0px; padding: 0px; z-index:10;}#enWord{ width:650px; height:40px; border:2px solid gray; margin-top:10px; margin-bottom:0px; padding: 1px; font-size:14px; }#sendButton{ width:65px; height:35px; padding: 1px; font-family: Arial,Helvetica,sans-serif; font-size:16px; }#chWord{position:relative; left:10px; top:30px; width:600px; font-size:20px; } ul{ list-style: none; margin: 0px; padding: 0px; z-index:11; } li.mouseOver{ background-color: #eeeeee; color: #aabbcc; font-size:18px; font-weight:bold; } li.mouseOut{ background-color: #FFFFFF; color: #004a7e; } </style></head><body bgcolor="#RGB(67,65,65)"><div id="outer"><img src="./image/logo.jpg" /><br /><div id="up"><a href="getHisFromMysql.php" id="his" target="_blank">查询历史</a><a href="./addword/addword.html" id="his" target="_blank">添加词条</a><a href="./dict_info/dict.info.php" id="his" target="_blank">字典信息</a><a href="./friend/friend.html" id="his" target="_blank">发布交友</a><a href="./advice/advice.html" id="his" target="_blank">意见反馈</a></div><input type="text" id="enWord" onclick="clearContent();" onkeydown="setTimeout(send(event),300);" onblur="clearFill();"/><input type="button" id="sendButton" value="查询" onclick="query(1);" /><br /><ul id="showRes"></ul><div id="chWord"><div></div></body></html><!--the problem is when i enter three char, in fact , the js only send two char, it's can observe d by chrome console , but i had set val=$("enWord").value;if(val.length >=2 ) query(2);then i use setTimeout() to check onkeydown="setTimeout(send(event),300);" it's seem like not a event catca delay problem--> 昨天论坛进不来,去stackflow发过一遍,很快就沉了,仅有一个人回复,说是让我缩减代码,把问题点的代码摘出来,,,,然后,就没有然后了 <input type="text" id="enWord" onclick="clearContent();" onkeyup="send(event);" onblur="clearFill();"/> 最开始用的就是keyup,不管用啊 管用,,,,我倒。我最开始就是用的keyup,后来抽风改成了keydown,,,然后没留意到这个问题,结贴给分了 设置点延迟就可以了。。function keyup(event){ var that = this; setTimeout(function(){ send.call(that,event); },10)}onkeyup="keyup(event);" 求个mysql语句 【求指点】move_upload_file 函数不能把文件存入指定目录下。 谁能黑我网页,黑成功有奖! php返回值在firefox下中文乱码 请教怎样控制行数和字数 PHP的输出方式(没分了) PHP Socket函数使用FTP 主动模式如何来操作? 怎样控制输入时,不允许使用快捷键ctrl+c 自动生成静态页面,内容太长分页问题?请指教 PHP怪问题。请看源代码 学习PHP,遇到一个很困惑的问题。 用thinkphp的大神看过来
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" /><script type="text/javascript">
//清空补全表单
function clearFill()
{
var ul=$("showRes");
if(len=ul.childNodes.length)
{
//window.alert(len);
for(var i=len-1; i>=0; i--)
{
ul.removeChild(ul.childNodes[i]);
}
ul.style.display="none";
}
}
//创建XHR
function getXMLHttpRequest()
{
var xmlhttp=null;
if(window.ActiveXObject)
{
xmlhttp = new ActiveXObject("Microsoft.XMLHttp");
}
else
{
xmlhttp=new XMLHttpRequest();
}
return xmlhttp;
}
//发送AJAX查询
function query(type)
{
var url="/ciba/niujin-alpha/process.php";
//查询结果
if(type==1)
{
var data="?enword="+$('enWord').value+"&type="+type+"&rand="+Math.random();
var en=$('enWord').value;
//$('enWord').value="";
}
//发送Ajax补全
else if(type==2)
{
var data="?enword="+$('enWord').value+"&type="+type+"&rand="+Math.random();
var en=$('enWord').value;
}
//window.alert(type);
xmlhttp=getXMLHttpRequest();
if (xmlhttp)
{
xmlhttp.open("get", url+data,true);
//window.alert(url+data);
xmlhttp.onreadystatechange=function()
{
//window.alert(xmlhttp.readyState);
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
var res=xmlhttp.responseText;
res=eval("("+res+")");
//window.alert(res.flag);
if(res.flag==1)
{
words= res.result;
//window.alert(words.length);
item='';
for(i in words)
{
item += "<p style = ' border: 1px solid gray; width:650px; background-color:grey; color: #000090;'>"+words[i]+"<p>";
}
$("chWord").innerHTML= "<span style='color:#a00000;'>"+en+"</span>"+":<br /> "+item;
}
else if(res.flag==2)
{
var parent=document.getElementById("showRes");
var result=res.result;
clearFill();
for(i in result)
{
var text=document.createTextNode(result[i]);
var li=document.createElement("li");
li.appendChild(text);
parent.appendChild(li);
li.onmouseover = function(){
this.className = "mouseOver" ; //鼠标指针经过时高亮
}
li.onmouseout = function(){
this.className = "mouseOut" ; //鼠标指针离开时恢复原样
}
li.onclick = function(){
//用户单击某个匹配项时、设置输入框为该项的值
$("enWord").value = this.firstChild.nodeValue;
query(1);
clearFill(); //同时清除提示框
}
}
parent.style.display="block";
}
}
}
xmlhttp.send(null);
}
}
//捕捉回车键,如果是,进行查询
function sendQuery(event)
{
var ul=$("showRes");
if(ul.style.display=="block")
{
ul.style.display="none";
}
query(1);
return false;
}//补全时,发送ajax查询
function sendFill(event)
{
var val=$("enWord").value;
if(val.length >=2 )
{
query(2);
}
}UlIndex=0;
function send(event)
{
//当检测到按下的是回车键时
if(event.keyCode == 13)
{
sendQuery(event);
}
//当检测到按下的是a-z A-Z时
else if(event.keyCode>=65 && event.keyCode<=90 || event.keyCode>=97&&event.keyCode<=122)
{
sendFill(event);
}
//当检测到按下的是向下键时
else if(event.keyCode == 40 || event.keyCode == 39)
{
if($("showRes").hasChildNodes())
{
var items = $("showRes").childNodes;
var len = items.length;
//window.alert(len);
if(len>0)
{
if((UlIndex++) >= len){UlIndex = len;}
//window.alert(items[UlIndex].firstChild.nodeValue);
//items[UlIndex%len].onfocus = function(){this.style.backgroundColor="#aabbcc";}
//event.target.style.background-color="#aabbcc";
$("enWord").value = items[UlIndex%len].firstChild.nodeValue;
}
if(event.keyCode==39)
{
sendQuery();
}
}
}
//当检测到按下的是向上键时
else if(event.keyCode == 38 || event.keyCode == 39)
{
if($("showRes").hasChildNodes())
{
var items = $("showRes").childNodes;
var len = items.length;
if(len>0)
{
if((UlIndex--) <= 0){UlIndex = 0;}
//items[((--UlIndex)%len)].style.background-color="#aabbcc";
$("enWord").value = items[(UlIndex%len)].firstChild.nodeValue;
}
if(event.keyCode==39)
{
sendQuery();
}
}
}
else if(event.keyCode==8)
{
sendFill();
if($("enWord").value.length<=1)
{
clearFill();
}
}
}
//清空输入框
function clearContent()
{
$("enWord").value="";
return false;
}
function $(id)
{
return document.getElementById(id);
}
window.onload = function()
{
$("enWord").setAttribute("autocomplete", "off");
$("enWord").focus();
}
</script><style rel="stylesheet" type="text/css">
#outer{margin-left: 400px;}
#up{margin-top:5px;}
#his{color:gray;
font-size:16px;}
#showRes{
background-color:white;
border: 1px solid gray;
width:650px;
display:none;
list-style: none;
margin: 0px; padding: 0px;
z-index:10;}
#enWord{
width:650px;
height:40px;
border:2px solid gray;
margin-top:10px;
margin-bottom:0px;
padding: 1px;
font-size:14px;
}
#sendButton{
width:65px;
height:35px;
padding: 1px;
font-family: Arial,Helvetica,sans-serif;
font-size:16px;
}
#chWord{position:relative;
left:10px;
top:30px;
width:600px;
font-size:20px;
}
ul{
list-style: none;
margin: 0px; padding: 0px;
z-index:11;
}
li.mouseOver{
background-color: #eeeeee;
color: #aabbcc;
font-size:18px;
font-weight:bold;
}
li.mouseOut{
background-color: #FFFFFF;
color: #004a7e;
}
</style>
</head>
<body bgcolor="#RGB(67,65,65)">
<div id="outer">
<img src="./image/logo.jpg" /><br />
<div id="up">
<a href="getHisFromMysql.php" id="his" target="_blank">查询历史</a>
<a href="./addword/addword.html" id="his" target="_blank">添加词条</a>
<a href="./dict_info/dict.info.php" id="his" target="_blank">字典信息</a>
<a href="./friend/friend.html" id="his" target="_blank">发布交友</a>
<a href="./advice/advice.html" id="his" target="_blank">意见反馈</a>
</div><input type="text" id="enWord" onclick="clearContent();" onkeydown="setTimeout(send(event),300);" onblur="clearFill();"/>
<input type="button" id="sendButton" value="查询" onclick="query(1);" /><br />
<ul id="showRes">
</ul>
<div id="chWord"><div>
</div>
</body>
</html>
<!--the problem is when i enter three char, in fact , the js only send two char, it's can observe d by chrome console , but i had set val=$("enWord").value;if(val.length >=2 ) query(2);then i use setTimeout() to check onkeydown="setTimeout(send(event),300);" it's seem like not a event catca delay problem-->
function keyup(event){
var that = this;
setTimeout(function(){
send.call(that,event);
},10)
}
onkeyup="keyup(event);"