<html>
<body>
<style>
ul,li{margin: 0; padding: 0;width:100%;}
</style>
<script language="javascript" type="text/javascript">
function checkword()
{
var wordvalue=document.getElementById("word").value.toLowerCase();
var alltxt="管理员|apple苹果|all全|big大|bad坏|cut剪切|car车|daph8|eeg|egg|eat|fuck|fuck you|fix|good|hand|hidden|ill|jack|jad|kevin|long|man|number|oio|part|pp|quit|QQ|rest|reg|set|submit|time|tag|uuzo.cn|uuzo|view|windows|want|xy|xun|young|yuyu|zoo|Zzz|锋.David|David|哈哈|
www.uuzo.cn|
www.uuzo.com";
var alltxtpp=alltxt.toLowerCase();
var alltxt_xiang=alltxt.split("|");
var alltxt_xiang1=alltxtpp.split("|");
var inhtml="<ul>"
var isyou=0;
for (i=0;i<alltxt_xiang1.length;i++)
{
if (alltxt_xiang1[i].substr(0,wordvalue.length)==wordvalue)
{
inhtml=inhtml+"<li onclick=\"document.getElementById('word').value=this.innerHTML;document.getElementById('showmenu').style.display='none';\" onmouseover=\"this.style.backgroundColor='#666666'\" onmouseout=\"this.style.backgroundColor=''\">"+alltxt_xiang[i]+"</li>";
isyou=1;
}
}
inhtml=inhtml+"</ul>";
if (isyou==1)
{
document.getElementById("showmenu").innerHTML=inhtml;
document.getElementById("showmenu").style.display="";
}
else
{
document.getElementById("showmenu").innerHTML="";
document.getElementById("showmenu").style.display="none";
}
if (wordvalue=="")
{
document.getElementById("showmenu").innerHTML="";
document.getElementById("showmenu").style.display="none";
}
}
</script>
<input type="text" name="word" size="20" id="word" onkeyup="checkword()" style="border:1px solid #666666;width:200px;height:25px;">
<div style="position: absolute; width: 200px; height: 100px; z-index: 1; left: 10px; top: 40px;border:1px solid #666666;display:none;" id="showmenu"></div></body></html>
分享到：
相关推荐
**jQuery版搜索框自动补全与智能提示技术详解** 在网页开发中，为了提供用户友好的界面和便捷的搜索体验，经常会用到搜索框自动补全功能。此功能能够根据用户输入的部分关键词，实时显示出匹配的建议结果，极大地...
它负责监听用户的输入事件，当用户在搜索框中输入字符时，JavaScript代码会触发一个函数，该函数通常会发送一个AJAX请求到服务器，查询与输入内容匹配的数据。服务器返回匹配结果后，JavaScript会把这些结果显示在...
在搜索框自动补全的场景下，用户输入关键词时，jQuery会通过Ajax发送请求到服务器，获取与输入匹配的建议数据。 1. **基本结构**： - **HTML**：通常，搜索框是一个`<input>`元素，可能包含一个`<div>`来显示补全...
本项目旨在仿照谷歌和百度的样式，实现一个具有高效、易用的输入自动补全功能。 首先，我们要理解自动补全的基本原理。该功能通常基于用户在输入框中键入的部分字符，快速提供可能的匹配项列表。这个过程涉及两个...
本文将深入探讨如何使用JavaScript实现一个具备模糊搜索功能的自动补全提示输入框，根据提供的标题和描述，我们将分析其关键知识点。 首先，自动补全的核心是通过用户输入的部分文字来预测他们可能想要完成的完整...
总结来说，"autoComplete 文字自动补全demo1"是一个利用jQuery插件实现的自动补全功能实例，它展示了如何在前端应用中创建高效、可定制的自动补全输入体验。通过对相关文件的学习，开发者可以深入理解这一功能的实现...
从给定的文件信息来看，虽然标题和描述都是“JavaScript自动补全”，但是代码片段却显示了一个使用JSP（Java Server Pages）与JavaScript结合来实现输入框自动补全功能的例子。下面将对这段代码涉及的关键知识点进行...
《jQuery+Ajax搜索框输入文字自动补全代码详解》 在网页开发中，为了提供更加友好和高效的用户体验，我们常常需要实现搜索框的输入自动补全功能。这使得用户在输入关键字时，系统能实时给出匹配的建议，极大地提高...
jQuery百度搜索自动补全插件基于流行的JavaScript库jQuery和typeahead.js实现，为网页上的搜索框提供了高效且用户友好的自动补全功能。这个插件主要用于提升用户体验，尤其是在需要处理大量数据并希望用户能快速找到...
【标题】"仿搜索引擎文本自动补全"是一个常见的前端功能，它主要应用于输入框中，当用户输入文本时，系统会根据已输入的部分提供相关的建议，以帮助用户快速完成搜索词或输入内容。这一功能在现代网站和应用程序中...
在这个插件中，我们需要监听用户的输入事件，当用户在搜索框输入时，触发自动补全的过程。 3. **AJAX请求**：为了获取与用户输入相关的建议数据，通常需要向服务器发送异步请求。jQuery的`.ajax()`函数是进行AJAX...
"搜索记录和自动补全分开提示demo"是一个典型的搜索功能优化案例，它结合了热门搜索记录和实时输入的自动补全建议，以提高用户体验。下面我们将详细探讨这些知识点。 首先，**搜索记录**是指系统保存用户过去的搜索...
EXTJS并没有直接提供一个名为"自动补全"的组件，但它可以通过模拟Combobox组件来实现这一效果。Combobox是EXTJS中的一个下拉选择框，它可以显示一个下拉列表供用户选择，同时也可以配合自动补全功能。 首先，让我们...
标题中的“模拟google自动补全功能”指的是在Web应用程序中实现类似于Google搜索框的自动补全功能。这种功能能够提高用户输入效率，提供便捷的搜索体验。它基于Ajax（Asynchronous JavaScript and XML）技术，利用...
在Java开发中，实现自动补全功能是一种常见的需求，特别是在Web应用中，它可以极大地提高用户输入的效率和体验。这个项目使用了Java后端技术和AJAX前端技术来完成这一功能。接下来，我们将深入探讨如何利用Java和...
在本项目中，我们将探讨如何利用JavaScript实现一个具有模糊搜索功能的自动补全输入框。 首先，这个项目的目标是创建一个类似百度或谷歌搜索那样的输入框，当用户开始输入时，系统会根据已输入的部分文字提供可能的...
在本文中，我们将深入探讨如何使用jQuery来实现一个模仿Google搜索的自动补全功能。这个功能常见于许多网站，能够极大地提升用户体验，帮助用户快速找到他们想要搜索的关键词。我们将基于给定的"jquery模仿google...
谷歌自动补全功能是通过分析用户的输入，预测并显示可能的搜索词，使得用户可以快速选择合适的选项，而无需完全输入整个词汇。这种技术在搜索引擎、网站搜索框、应用内搜索等多个场景都有广泛应用。 实现仿谷歌自动...
博主DavidHHS在iteye上分享了一个自动补全插件的源码，名为`autoSelect-plugin`。这个插件可能是基于JavaScript实现，可能兼容jQuery或其他库。通过阅读源码，我们可以学习以下知识点： 1. DOM操作：插件需要对...
在本篇博客“AJAX学习总结（九）---Jquery实例：仿googlesuggest自动补全功能”中，作者分享了如何使用jQuery实现一个类似Google Suggest的自动补全功能，这是一种常见的前端交互设计，广泛应用于搜索框输入时提供...