输入"1",有提示,否则没有

suggest.jsp

#suggest {
background-color: #e0e0e0;
width: 200px;
}
    var xhr;
function createXhr() {
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
} else {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
} /* 提示词被选中 */
function select(divElm){
var inputElm = document.getElementById("keyword");
// 选中提示词
inputElm.value=divElm.innerText;
// 关闭提示框
document.getElementById("suggest").innerHTML="";
}
/* 输入后提示(输入1,有提示,否则没有) */
function search() {
var inputElm = document.getElementById("keyword");
// 获取输入的内容
var inputWord = inputElm.value; createXhr();
xhr.onreadystatechange = function cbSearch() {
if (xhr.readyState == 4 && xhr.status == 200) {
var rsp = xhr.responseText;
var json = eval("(" + rsp + ")"); // 获取提示词组
var array = json.array; var addHtml = "";
if (array!=null) {
// 提示词组不为空,循环取词,添加div
for ( var idx in array) {
addHtml += "<div onclick='select(this)'>" + array[idx] + "</div>";
}
}
//提示框 设 提示词
document.getElementById("suggest").innerHTML = addHtml;
}
};
xhr.open("get", "AjaxServlet?para=" + inputWord, true);
xhr.send(null);
}
    <!-- 按键抬起才能取到输入内容,否则(keypress/keydown)是上次输入内容 -->
<input type="text" id="keyword" onkeyup="search()">
<br>
<div id="suggest"></div>

AjaxServlet.java

    public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setCharacterEncoding("utf-8");
AhJson aj = new AhJson();
String para=request.getParameter("para"); JSONObject jo = new JSONObject();
JSONArray a = new JSONArray();
if ("1".equals(para)){
a.add("1");
a.add("163");
a.add("12306");
jo.put("array", a);
}
response.getWriter().write(jo.toString()); }

Js_Ajax_输入词提示的更多相关文章

  1. jquery 实现邮箱输入自动提示功能:(二)

    上篇文章写到了一个不错的jquery实现邮箱输入自动提示功能,发现还有一个不错的自动提示插件: 先展示结果如图: html代码: <center> <h1>输入邮箱试试!< ...

  2. jquery 实现邮箱输入自动提示功能:(一)

    记得去年做某个项目的时候,用到了邮箱输入自动提示功能,于是网上搜了一下,发现了这个写得不错,现在回想起来,转载一下,方便查阅. 邮箱的广泛使用得益于它的免费,因此很多网站在注册的时候都会直接使用邮箱作 ...

  3. 命令行输入Jmeter提示不是内部或外部命令,处理方式:添加环境变量

    命令行输入Jmeter提示不是内部或外部命令,需要在环境变量path中添加jmeter的bin目录绝对路径 我的电脑 > 右击 >属性 > 高级系统变量 > 环境变量 > ...

  4. jQuery 下拉框输入匹配提示选项

    做页面输入时,为方便输入和提高用户体验,常用下拉框,当下拉选项数据很多时,也不易找到想要的选项,这时,提供一种下拉框输入匹配提示选项,如下: 图示

  5. Notepad++ 【自动完成】与【输入时提示函数参数】互相冲突,无奈

    Notepad++ 既然可以在输入时提示函数参数,可是当提示函数参数的时候,输入具体参数时[自动完成]失效了. 一位用户遇到和我一样的问题:https://community.notepad-plus ...

  6. GeoGebra 代数输入的提示和技巧

    GeoGebra是Mac平台上一款自由且跨平台的动态数学软件,提供各级教育使用,包含了几何.代数.表格.图形.统计和微积分,集中在一个容易使用的软件.   确认表达式 始终按  Enter  键确认您 ...

  7. Android之自动文本输入识别提示

    相信大家都熟悉自动识别提示吧,在我们的生活中随处可见,今天就让我为大家简单介绍一下它是如何设计的. 所谓自动识别输入即是根据用户输入的已有信息,为用户提示可能的值,方便用户完成输入.在Android设 ...

  8. jquery 实现邮箱输入自动提示功能

    邮箱的广泛使用得益于它的免费,因此很多网站在注册的时候都会直接使用邮箱作为账号名 为了提高用户的体验,很多网站都会实现邮箱输入的自动提示功能,所有自己也实现了一个,先看下效果吧,觉得效果还行的就拿去 ...

  9. google chrome中如何删除一条输入网址提示

    在google chrome中网站栏输入字母的时候会出现网址的提示,如下图: 之前遇到个问题,不知道之前打错了www.baidu.com为wwww.baidu.com(也会跳转到百度)导致一输入“w” ...

随机推荐

  1. 快消零售行业怎么用K2做开关店管理?

    提起迪卡侬,想到的便是它汇聚所有运动于同一个屋檐下的盛况.从来没有一家体育用品零售店可以像迪卡侬一样,涵盖几乎所有级别的运动产品.从入门级到最专业的运动产品,应有尽有,不仅产品质量有保证,价格也平易近 ...

  2. HDU1004 BALLO0N

    Let the Balloon Rise Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others ...

  3. Oracle日期时间

    今天上班一个问题:sql获取最近三天内上传文档在页面显示标记new,超过三天则不显示标记,并且在标题标明new数量. 完成思路:sql上加一字段查询出三天内为1,其他为非1;在angularJs的se ...

  4. Linq一 基础知识

    1.什么是Linq 他是VS2008(.net framework 3.5)之后一项重大的突破 全程Lnaguage Integrated Query,可以成为数据迭代器. 主要有以下5大块组成: L ...

  5. php大力力 [042节] 今天做了一个删除功能

    php大力力 [042节] 今天做了一个删除功能 if(isset($_GET['action'])){ if($_GET['action']=="del"){ $sql = &q ...

  6. 深入解析Javascript闭包

    首先给个例子: function PfnOuter(){ var num=999; function PfnInner(){ alert(num); } return PfnInner; } var ...

  7. C#利用SMTP服务器发送邮件

    使用.net(C#)发送邮件学习手册(带成功案例) 1.了解发送邮件的三种方式 2.实例介绍使用client.DeliveryMethod = System.Net.Mail.SmtpDelivery ...

  8. rsync异机备份

    参考http://www.cnblogs.com/itech/archive/2009/08/10/1542945.html 1.服务器 新建/etc/rsyncd.conf  ->新建/etc ...

  9. spl_autoload_register更改框架文件引用模式

    今天单点登陆要用到 spl_autoload_register,但是YII的Yii::autoload在包含失败的时候会抛异常,就不会执行(spl_autoload_call)其他spl_autolo ...

  10. HTML Meta标签

    Meta标签用于存储web页面上的信息.本质上讲,它是信息数据.他帮助浏览器和搜索引擎更好地知道.理解页面内容. Web开发者,通过Mata标签设置页面描述.作者或关键字等等.然而,许多meta标签功 ...