Javascript实现类似google搜索框输入提示功能

本文主要内容:p居中、层定位、类google输入提示示例,在线qq查询,自动刷新

类似google搜索框输入提示功能的示例代码,采用层定位,居中对齐,input 的输入改变、失去焦点、获得焦点事件......解决了onblur和onclick同时被调用的失效问题。

时间: 2024-09-17 01:41:18

Javascript实现类似google搜索框输入提示功能的相关文章

显示-仿百度搜索框智能提示功能,在搜索关键字变色的功能里,输入数字会有问题

问题描述 仿百度搜索框智能提示功能,在搜索关键字变色的功能里,输入数字会有问题 仿百度搜索框智能提示功能,在搜索关键字变色的功能里,输入数字会有问题,如果数组中含有(1)数字,当文本框第一次按下1这个数字来搜索时,会出现问题,例如:数组中有2123,在文本框输入1,结果会显示2123[[[1]]]:如果数组中有两条或以上含有(1)数字的,则搜索结果第一行会这样显示,之后的都正常显示.输入","时也有问题,会出现一个标签字符串,原因是因为都","来分割的. 贴上我的搜

asp.net使用jquery实现搜索框默认提示功能

 这篇文章主要介绍了asp.net使用jquery实现搜索框默认提示功能,大家参考使用吧 文本框中创建默认文本提示   通常用户在搜索内容时,在文本框输入内容前,文本框都会给出默认提示,提示用户输入正确的内容进行搜索.   当文本框获得焦点,如果文本框内容跟提示内容一样,提示内容会自然消失.   当文本框没有任何值并失去焦点,文本框内容会重新生成默认提示.   为了实现上面的需求,代码如下:   代码如下: <%@ Page Language="C#" AutoEventWire

Servlet+Ajax实现智能搜索框智能提示功能

利用无刷新技术智能变换搜索框的提示,同百度搜索 效果图 其基本原理: 1.给搜索框编写js绑定事件onkeyup(键盘输入时).onfocus(当鼠标点击搜索框外的时候清空提示) 2.首先获得用户输入.之后将获得的数据传给服务器,服务器将数据传给后台,后台获取服务器传来的数据进行处理,得到关联数据,向前端返回json格式,前端通过回调函数,将返回来的json解析成文本,将文本传输到搜索框下方的展示窗 如下为支持json的jar包 search.jsp <%@ page language="

JS实现仿google、百度搜索框输入信息智能提示的实现方法

  这篇文章主要介绍了JS实现仿google.百度搜索框输入信息智能提示的实现方法,实例分析了javascript实现智能提示功能的技巧,非常具有实用价值,需要的朋友可以参考下 本文实例讲述了JS实现仿google.百度搜索框输入信息智能提示的实现方法.分享给大家供大家参考.具体如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38

JavaScript如何实现在文本框(密码框)输入提示语_javascript技巧

有时候我们需要在登陆表单有一些提示语言,比如"请输入用户名"和"请输入密码"等语言,至于用户名好说,但是在密码框中出现"请输入密码"这样的语言就有点麻烦了,因为在密码框输入的内容不会以明码显示.如果动态的控制type属性的话就有兼容性问题,如果input已经存在于页面中的话,在IE8和IE8以下浏览器中,type属性是只读的.所以就得想其他办法,代码如下: <!DOCTYPE html> <html> <head&g

jquery+php实现搜索框自动提示_jquery

今天突然想给本站做个搜索页面,这样用户可以通过搜索来找到自己喜欢的内容,也避免了在海量信息中手动查找资源的麻烦,我的目标和百度首页的效果类似,当用户输入要搜索的文字时,我们在下方给出相关的十条信息,如果用户要找的就是这十条信息内的某一条,那么简单,直接点击就可在新页面中打开页面,主要就是想更人性化一点,让用户使用起来更方便. 先看一下效果图吧,这样更有动力,要不然大家还不知道我在讲什么,到底要达到什么样的效果! jquery+php实现搜索框自动提示 下面先主要讲解原理: 在search.htm

标签-仿百度搜索框只能提示上下键移动的功能效果 js+jquery

问题描述 仿百度搜索框只能提示上下键移动的功能效果 js+jquery 搜索结果不能上下移动,只能按一下,按第二下的时候结果只剩下一个了,currentSelIndex总是为0 ,currentSelIndex是记录 标签id的变量. 首先,我输入一个字符,匹配到的结果会在文本框下方显示出来.因为代码都是写在搜索框的onkeyup ()事件中的,每按一下键盘都会触发该事件,当我第一次按(下)键的时候,相应的会把选中的文本赋 给搜索框,所以按第二次的时候又会重新触发该事件,搜索条件变成了第一次按(

PHP and AJAX 仿 Live与google 搜索框

PHP and AJAX 仿 Live与google 搜索框 AJAX的Live搜索 在AJAX以下例子,我们将表现出生活的搜索,那里的服务器获得搜索结果,同时用户类型. Live搜索有许多好处,相比传统的搜索: 匹配结果表明您键入 结果狭隘你继续输入 如果结果变得过于狭窄,删除字符看到一个更广泛的结果 这个例子包含了四个网页: 一个简单的HTML表单 一个JavaScript 一个PHP网页 XML文件 在这个例子中,结果发现在一个XML文件( links.xml ) .为了使这个例子小和简单

利用jsonp跨域调用百度js实现搜索框智能提示_javascript技巧

项目中常常用到搜索,特别是导航类的网站.自己做关键字搜索不太现实,直接调用百度的是最好的选择. 使用jquery.ajax的jsonp方法可以异域调用到百度的js并拿到返回值,当然$.getScript也可以实现跨域调用js.  ok,了解了jsonp的原理和应用后,我们看看百度的智能提示是如何做的 在chrome的调试窗口下看看百度搜索发出的请求.当输入关键字"a",请求如图:  用firebug看下请求的参数,如图: 请求方式:get请求请求参数:wd明显是要搜索的关键字:cb是请