jquery-ui-custom autocomplete
//jsp
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"+ request.getServerName() + ":" + request.getServerPort()+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>autocomplete</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link href="<%=basePath%>js/autocomplete/jquery-ui-1.10.3.custom.css" rel="stylesheet">
<script src="<%=basePath%>js/jquery-1.7.2.min.js"></script>
<script src="<%=basePath%>js/autocomplete/jquery-ui-1.10.3.custom.js"></script>
<script>
$(function(){
$( "#autocomplete" ).autocomplete({
minLength: 1,//最少输入1个字符才执行
source: 'autocomplete.action'
});
})
</script>
</head>
<style>
body {
font: 62.5% "Trebuchet MS", sans-serif;
margin: 50px;
}
</style>
<body>
<h2 style="margin-top: 2em;">
Autocomplete
</h2>
<div>
<input id="autocomplete" title="type "a"">
</div>
</body>
</html>
//struts.xml
<action name="autocomplete" class="com.test.action.testAction" method="autocomplete"></action>
//java
public String autocomplete() throws Exception{
String[] temp = "align,both,card,dream,error,fail,gson,hello,invaid,job,kill".split(",");
String name = "[";
for(int i=0;i<temp.length;i++){
if(temp[i].indexOf(term)!=-1){
name += "\""+temp[i]+"\",";
}
}
if(name.length() > 1)
name = name.substring(0,name.length()-1);
name+="]";
System.out.println(name);
HttpServletResponse res = ServletActionContext.getResponse();
PrintWriter pw = res.getWriter();
pw.write(name);
pw.flush();
pw.close();
return null;
}
jquery-ui-custom autocomplete的更多相关文章
- 弹窗中使用jquery ui的autocomplete自动完成插件无效果 实际是被遮挡了
在普通页面上使用jquery ui的autocomplete自动完成插件时正常显示提供选择的下拉框,但是放到弹窗中的时候就无法显示这个选择的下拉框,其它效果正常: 估计是被弹出窗遮挡了,网络搜索了jq ...
- ASP.NET jQuery 随笔 使用jQuery UI的Autocomplete方法实现文本框的自动搜索填充功能
首先当然是去下载JQuery UI ,这里这里是下载地址http://jqueryui.com/ 第一步是点击这里 第二步选择你想要下载的主题进行下载 我这里是选择的cupertino主题包 点击圆圈 ...
- Jquery UI Custom的兼容问题
在测试过程中遇到Jquery UI Dialog异常的情况,表现为在拖拽Dialog标头时出现Dialog跳跃的问题,对比jquery ui与jquery在协调工作情况下的运行情况. 1.环境: Wi ...
- JQuery UI之Autocomplete(4)多值输入、远程缓存与组合框
1.多值输入 首先加入相关的css和js文件,以及对应的HTML代码如下: <link href="../css/jquery-ui.css" rel="style ...
- JQuery UI之Autocomplete(3)属性与事件
1.Autocomplete的属性 首先引入css和js文件,以及对应的HTML代码如下: <link href="../css/jquery-ui.css" rel=&qu ...
- JQuery UI之Autocomplete(1)入门程序
1.Autocomplete的主要属性:source:即为指定智能提示下拉框中的数据来源,支持三种类型. Array,主要用于本地化数据提供,支持两种格式:字符串数组 [ "Choice1 ...
- JQuery UI之Autocomplete(2)后端获取数据
1.Autocomplete获取后台数据 首先引入css和js文件,以及对应的HTML代码如下: <link href="../css/jquery-ui.css" rel= ...
- Node.js配合jQuery UI autocomplete的应用
Node.js擅长的领域为: 不需要很多运算 吞吐量要求高 进消息轻并且要求快 出消息轻并且要求快 网上的例子都是socket.io的,我一直在想到底能用在什么地方?根据node.js的优点(擅长领域 ...
- jQuery ui autocomplete下拉列表样式失效解决,三种获取数据源方式,
jQuery有很多很多的已经实现,很漂亮的插件,autocomplete就是其中之一.jQuery ui autocomplete主要支持字符串Array.JSON两种数据格式,jQuery ui b ...
- JQuery UI Autocomplete与jquery.autocomplete.js
程序中要把一个select改成可以下拉搜索的,就想到了使用下autocomplete.js大概是这么个东西. 问了下同学,推荐我使用Jquery Ui autocomplete,下载下来开始调试使用, ...
随机推荐
- 闲里偷忙的CPU-某个kwoker进程忙
https://zhuanlan.zhihu.com/p/34311472 有一类比较特殊的CPU使用率问题,这类问题的特点是,系统平均CPU使用率很低,但是个别CPU的使用率非常高.今天借助这个真实 ...
- stm32 PWM输出学习
STM32 的定时器除了 TIM6 和 7,其他的定时器都可以用来产生 PWM 输出.其中高级定时器 TIM1 和 TIM8 可以同时产生多达 7 路的 PWM 输出.通用定时器也能同时产生多达 4路 ...
- linux 编译安装php7
1.下载php7安装包: php7 2.解压 .tar.gzcd php-7.1.5 3.可能需要的扩展 yum install libmcrypt libmcrypt-devel mcrypt mh ...
- java学习第十四天
1:正则表达式(理解) (1)就是符合一定规则的字符串 (2)常见规则 A:字符 x 字符 x.举例:'a'表示字符a \\ 反斜线字符. \n 新行(换行)符 ('\u000A') \r 回车符 ( ...
- jQuery 3 有哪些新东西
jQuery 的横空出世,至今已有十个年头了,而它的长盛不衰显然不是没有理由的.jQuery 提供了极为友好的接口,使得开发者们可以方便地进行 DOM 操作.发起 Ajax 请求.生成动画……不一而足 ...
- C# FTPHelper帮助类
网上的FTPHelper类感觉用起来不方便,而且代码的质量也不高,因此自己重新写了一个FTPHelper.此文之前是发布在我的CSDN博客中的,现在转过来. 主要就是借鉴了DbHelper的Creat ...
- Hibernate课程 初探一对多映射3-3 单向多对一的测试
public static void testManyToOne(){ Student stu1 = new Student("小明","男"); Studen ...
- Windows之CMD查看系统信息
Windows 系统通过命令行(CMD)查询系统信息有两种方式: 1.图形化界面: 在“运行”中键入CMD,然后输入 dxdiag,回车后弹出图形化界面 ------ DirectX 诊断工具. 2. ...
- The tenth day
Why the long face? 你为什么不高兴,你为什么扳着脸,愁眉苦脸. Why the long face? Are you feeling down again? 你脸怎么这么臭,你又心情 ...
- Javascript基础--数据类型
一.基本数据类型 1.字符类型:表示字符的类型,例:'aaa',"aaaa",'123456',''(空字符) 2.数字类型:表示数字的类型,例:0,1,3.1415936等 特殊 ...