兑现一个ajax输入框
日期：2014-05-17 浏览次数：20805 次
实现一个ajax输入框
我想实现一个input输入条，<input type="text">
然后用户可以输入代码，唯一就是，当他开始输入的时候有个类似选项单的自动提示后面的内容
举个例子吧， 输入1，下面提示123 132 133， 然后我继续输入2，下面就提示123.回车输入完成
就是说我有很大的一个id数据库，当用户记住前几个的时候后面就能给一些提示，不用记住一长串数字。
我觉得应该用ajax完成，但是有没有什么好的方法，不会我每次判断键盘按下事件然后调用ajaxa引擎并返回？
有没有实现好的模块我可以直接用的，谢谢
------解决方案--------------------
在输入框下方加个DIV层，用户输入数据时ajax请求后台数据，将数据显示在下面的层中！~
------解决方案--------------------
// 这个AjaxDemo 正和楼主之意
/// *********************************************************
//AjaxSourch.txt：下面这个文件当做数据库，存放在C:\AjaxSourch.txt
工人是好人
a
ab
af
ajax
abcdefg
abcccc
abdddd 1-7
www.gxu.edu.cn
wwwgxueducn
WWW.XUE.EDU.CN
WWWGXUEDUCN
百度
百度知道
百度图片
工人
工贸
工龄
工牌1-19
/// *********************************************************
// 这是前台页面 Tip.html：
我想实现一个input输入条，<input type="text">
然后用户可以输入代码，唯一就是，当他开始输入的时候有个类似选项单的自动提示后面的内容
举个例子吧， 输入1，下面提示123 132 133， 然后我继续输入2，下面就提示123.回车输入完成
就是说我有很大的一个id数据库，当用户记住前几个的时候后面就能给一些提示，不用记住一长串数字。
我觉得应该用ajax完成，但是有没有什么好的方法，不会我每次判断键盘按下事件然后调用ajaxa引擎并返回？
有没有实现好的模块我可以直接用的，谢谢
------解决方案--------------------
在输入框下方加个DIV层，用户输入数据时ajax请求后台数据，将数据显示在下面的层中！~
------解决方案--------------------
// 这个AjaxDemo 正和楼主之意
/// *********************************************************
//AjaxSourch.txt：下面这个文件当做数据库，存放在C:\AjaxSourch.txt
工人是好人
a
ab
af
ajax
abcdefg
abcccc
abdddd 1-7
www.gxu.edu.cn
wwwgxueducn
WWW.XUE.EDU.CN
WWWGXUEDUCN
百度
百度知道
百度图片
工人
工贸
工龄
工牌1-19
/// *********************************************************
// 这是前台页面 Tip.html：
- HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="pragram" content="no-cache">
<link href="Tip.css" type="text/css" rel=stylesheet charset="utf-8" />
<script language="javascript" type="text/javascript" src="Tip.js">
</script>
<title>Ajax Demo</title>
</head>
<body>
<h3>Ajax下拉提示演示</h3>
<div id="Exam">测试输入：a、Ajax</div>
<br />
<input type="text" id="ShowText" onblur="javascript:setTimeout('HideTTip()',300);"
onkeyup="javascript:if ( this.value!=''){ ShowTip(); } else { HideTTip(); }" size="50" autocomplete="off"/>
<input type="button" id="alert" name="alert" value="搜 索"
onclick="javascript:if(document.getElementById('ShowText').value!='') {alert('开 始 搜 索: '+document.getElementById('ShowText').value);}">
<div id="ShowTip" name="ShowTip" style="display:none"></div>
</body>
</html>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
