`
lybilq19
  • 浏览: 18963 次
  • 性别: Icon_minigender_1
  • 来自: 福州
社区版块
存档分类
最新评论

Ajax.Autocompleter的提示实现

阅读更多
引入标签(结合实际)
<%@ taglib uri="/webwork" prefix="ww"%>
<%@ taglib uri="/WEB-INF/c.tld" prefix="c"%>
引入js,css
<script type="text/javascript" 
src="<c:url value='/resources/js/autocomplete/prototype.js'/>">
</script>
<script type="text/javascript" 
src="<c:url value='/resources/js/autocomplete/scriptaculous.js'/>">
</script>
<link rel="stylesheet" type="text/css" 
href="<c:url value='/resources/js/autocomplete/autocomplete.css'/>" />

jsp页面
<ww:textfield name="keyword" cssStyle="width:420px;hight:50px" id="keyword" />
<div id="completeList" class="auto_complete"></div>
<script type="text/javascript" language="javascript" charset="utf-8">
     new Ajax.Autocompleter('keyword','completeList',
'<c:url value="/search/completeKeywords.action"/>',{tokens:' ',frequency:0.4});
</script>

completeList为提示输出容器,实现主要是依赖Ajax.Autocompleter
completeKeywords.action实现:
List keywords = keyWordsService.findKeywordsByPycode(keyword);
getRequest().setAttribute("keywords", keywords);

keyWordsService.findKeywordsByPycode根据输入的keywork获取对应提示的list
completeKeywords.action返回的jsp页面:
<%@ page contentType="text/html; charset=GB2312"%>
<%@ taglib uri="/webwork" prefix="ww"%>
<%@ taglib uri="/WEB-INF/c.tld" prefix="c"%>
<ul>
	<c:forEach items="${keywords}" var="keyword">
		<li>${keyword.keyword}</li>
	</c:forEach>
</ul>

这样就OK了
分享到:
评论

相关推荐

    jquery.autocomplete.js 自动补全插件实例

    5. **提示信息**:当没有匹配的选项时,可以设置`noMatch`回调函数来显示自定义的无结果信息。 6. **缓存机制**:为了提高性能,插件通常会缓存先前的查询结果。这在用户反复搜索相似内容时非常有用,但也可以通过...

    jquery.autocomplete 类包.rar

    不仅可以用于简单的搜索建议,还可以与其他jQuery插件结合,如Typehead.js或Ajax请求,实现更复杂的功能,如实时搜索、异步加载数据等。 总的来说,这个“jquery.autocomplete.zip”类包为开发者提供了一套完整的...

    Jquery自动完成

    这个功能通常是通过插件实现的,比如我们这里提到的`jquery.autocompleter.js`。这个插件允许开发者为HTML输入元素添加智能提示,当用户在输入框中键入文字时,系统会显示一列与输入内容匹配的建议选项。 首先,...

    ajax特效框架

    它通过在后台与服务器进行少量数据交换,使网页实现异步更新。在网页应用中,Ajax可以创建更快速、更互动的用户体验,用户不再需要等待整个页面重新加载,只需等待新数据的获取和显示。 **Script.aculo.us库** ...

    jquery autocomplete 自动完成 插件

    minLength: 2, // 用户至少输入两个字符才开始提示 delay: 300, // 延迟多久后发送请求 select: function(event, ui) { // 用户选择建议项后的回调 // 你可以在这里处理选中的值 } }); }); ``` ### 自定义...

    script.aculo.us

    - **工具提示和弹出框**: 提供了可自定义的工具提示和弹出框,使得信息展示更加灵活和吸引人。 - **表单元素增强**: 改善了标准HTML表单元素的外观和行为,例如,可以添加验证、自动完成等功能。 ### 3. 结构与...

    海量经典的jQuery插件集合

    - **功能概述**:通过Ajax技术实现文件上传功能,支持多文件上传。 - **应用场景**:适用于需要快速上传文件而无需刷新页面的场景。 **2. jQUploader** - **功能概述**:强大的文件上传插件,支持拖拽上传、进度条...

    Struts2标签库详解.doc

    6. `&lt;s:autocompleter&gt;`:实现自动完成功能,常用于输入框的智能化提示。 7. `&lt;s:checkbox&gt;`:创建复选框,可以绑定数据到Action的属性。 8. `&lt;s:checkboxlist list=""&gt;`:创建一组复选框,通常用于多个选项的选择...

    Struts2标签应用.

    6. `&lt;s:autocompleter&gt;`:实现自动完成功能,常用于搜索框,与Ajax结合使用。 B部分: 1. `&lt;s:bean&gt;`:类似于Struts1.x中的JavaBean标签,用于获取或设置JavaBean的属性值。 C部分: 1. `&lt;s:checkbox&gt;`:创建复选...

    struts2标签解释

    `&lt;s:autocompleter&gt;`:实现自动补全功能,通常用于搜索框,提供用户输入时的提示。 G. `&lt;s:combobox&gt;`:创建下拉选择框,可以利用AJAX动态加载数据。 H. `&lt;s:debug&gt;`:用于调试,显示系统运行时的详细信息,包括...

    240多个jQuery插件.doc

    - **AutoCompleter (Tutorial with PHP & MySQL)**: 使用PHP和MySQL实现的自动完成搜索插件。 - **quickSearch jQuery Plugin**: 快速搜索插件。 #### 8. 编辑器 - **Inline Edit & Editors**: 内联编辑插件。 ...

    240多个jQuery UI插件

    - **AjaxFileUpload**: 基于Ajax技术实现的文件上传插件,可以实现无刷新上传。 - **jQUploader**: 一款轻量级的文件上传插件,易于集成,适合快速开发。 - **MultipleFileUpload plugin**: 支持同时上传多个文件...

    Struts2标签详解及具体实例解析

    - 这个标签结合 AJAX 功能,可以实现输入框的自动补全,提高用户体验。 6. **复选框和多选框标签 `&lt;s:checkbox&gt;`、`&lt;s:checkboxlist&gt;`**: - `&lt;s:checkbox&gt;` 用于创建单个复选框,而 `&lt;s:checkboxlist&gt;` 可以创建...

    struts2标签整理

    这是一个结合Ajax技术的下拉框组件,用于实现自动完成功能。 ```jsp &lt;s:autocompleter name="query" list="items"/&gt; ``` ##### 7. `&lt;s:bean&gt;` - Bean标签 该标签用于显示Struts1.x中JavaBean的属性值。 ```jsp ```...

    struts2标签库

    该标签通过AJAX技术实现了输入框的自动补全功能,极大地提升了用户体验。 #### 4. `&lt;s:bean&gt;` 和 `&lt;s:checkbox&gt;` - **`&lt;s:bean&gt;`**:用于创建或访问JavaBean实例,类似于Struts1中的`&lt;bean:define&gt;`标签。Struts2...

    struts2常用标签

    - **功能**:结合Ajax技术实现自动完成功能。 - **示例**: ```xml &lt;s:autocompleter name="query" list="suggestions" theme="ui-autocomplete" /&gt; ``` ##### 6. `&lt;s:bean name=""&gt;` —— 显示Bean值 - **功能*...

Global site tag (gtag.js) - Google Analytics