<%@ page isELIgnored="false"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ page import="com.sunny.common.utils.StringUtil"%>
<%@ include file="/common/taglibs.inc"%>
<%@ page import="com.sunny.base.Convertutf"%>
<html>
<head>
<title>商品管理</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="/newver/js/jqueryAutocomplete/ui/jquery.ui.all.css">
<script src="/newver/js/jqueryAutocomplete/jquery-1.10.2.js"></script>
<script src="/newver/js/jqueryAutocomplete/ui/jquery.ui.core.js"></script>
<script src="/newver/js/jqueryAutocomplete/ui/jquery.ui.widget.js"></script>
<script src="/newver/js/jqueryAutocomplete/ui/jquery.ui.position.js"></script>
<script src="/newver/js/jqueryAutocomplete/ui/jquery.ui.menu.js"></script>
<script src="/newver/js/jqueryAutocomplete/ui/jquery.ui.autocomplete.js"></script> <link rel="stylesheet" href="/newver/js/jqueryAutocomplete/ui/demos.css"> <script type="text/javascript" language=javascript> $(function() {
function diseaseLabel( message ) {
$( "<div>" ).text( message ).prependTo( "#diseaseLabel" );
$( "#diseaseLabel" ).scrollTop( 0 );
} $( "#tags" ).autocomplete({
source: function( request, response ) {
$.ajax({
url: "merchandise!JibingList.html2",
dataType: "json",
data: {
name_startsWith: request.term
},
success: function( data ) {
response( $.map( data, function( item ) {
return {
label: item.name
}
}));
}
});
},
minLength: 2,
select: function( event, ui ) { // $("#diseaseLabel").val(ui.item.value); diseaseLabel( ui.item ?
"Selected: " + ui.item.value :
"Nothing selected, input was " + ui.item.value);
},
open: function() {
$( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
},
close: function() {
$( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
}
});
}); </script>
</head>
<body> <div class="ui-widget">
<label for="city">Your city: </label>
<input id="city">
Powered by <a href="http://geonames.org">geonames.org</a>
</div> <div class="ui-widget" style="margin-top:2em; font-family:Arial">
Result:
<div id="diseaseLabel" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
</div> </body>
</html>

jquery autocomplete插件结合ajax使用的更多相关文章

  1. Jquery autocomplete 插件示例

    通过Jquery autocomplete 插件动态传递输入参数完成自动完成提示: <%@ page language="java" import="java.ut ...

  2. [jQuery]jQuery DataTables插件自定义Ajax分页实现

    前言 昨天在博客园的博问上帮一位园友解决了一个问题,我觉得有必要记录一下,万一有人也遇上了呢. 问题描述 园友是做前端的,产品经理要求他使用jQuery DataTables插件显示一个列表,要实现分 ...

  3. jquery autocomplete插件

    jquery autocomplete插件 https://goodies.pixabay.com/jquery/auto-complete/demo.html autocomplete-table ...

  4. PHP结合jQuery.autocomplete插件实现输入自动完成提示的功能

    XHTML 首先将jquery库和相关ui插件,以及css导入.一共引用三个 jquery ,jquery_ui.js,jquery-ui.css 三个文件,不同版本小哥可能稍有差异(最后注意ajax ...

  5. 使用 jQuery Mockjax 插件模拟 Ajax 请求

    在实际的开发过程中,前端后台协商好了统一的接口,就各自开始自己的任务了.这时候我有这么一个 Ajax 请求需要从后台获取数据: $.ajax({ url: '/products/' }).done(f ...

  6. Jquery autocomplete插件的使用

    简单用法: <%@ page language="java" contentType="text/html; charset=UTF-8" pageEnc ...

  7. jquery autoComplete 插件

    github: https://github.com/Pixabay/jQuery-autoComplete/blob/master/demo.html 官网demo https://goodies. ...

  8. Jquery autocomplete 插件使用

    轻松实现类似百度输入框联想功能: autocomplete 是一个很厉害的插件,该插件基于jquery,在jquery官网能下载到最新版本. 首先,jQuery UI 是基于 jQuery 的,所以, ...

  9. jquery autocomplete 插件的使用

    Autocomplete 自动完成 功能:输入框在输入关键字后,根据输入的内容给出相关的下拉框供用户选择,自动完成输入内容. 插件:使用jqueryUI的自动完成小部件,文档地址:https://jq ...

随机推荐

  1. gui_mainfcn(gui_State, varargin{:});是什么意思

    gui_mainfcn函数执行过程中,要调用各个控件的CreateFcn函数(也就是控件创建的函数)来创建控件.如果对控件的一些属性设置不对,则控件就没法创建,gui_mainfcn函数就不能正确执行 ...

  2. sql复制表、拷贝表、临时表

    --insert into pppcopy select * from ppp //从表ppp中获取数据,并将其插入到pppcopy中,只拷贝表的数据,不拷贝表的结构(前提:表pppcopy1存在) ...

  3. 【HTML5】拖放(Drag 和 drop)

    效果图: <!DOCTYPE HTML> <html> <head> <style type="text/css"> #div1 { ...

  4. libyuv 编译for ios

    这里有编译好的库 https://bintray.com/yarr/ios/libyuv-ios# lipo -info libyuv.a  Architectures in the fat file ...

  5. c# 基础(重写与覆盖:接口与抽象,虚函数与抽象函数)

    总结 1:不管是重写还是覆盖都不会影响父类自身的功能(废话,肯定的嘛,除非代码被改). 2:当用子类创建父类的时候,如 C1 c3 = new C2(),重写会改变父类的功能,即调用子类的功能:而覆盖 ...

  6. HTML-Canvas03

    颜色合成 globalCompositeOperation 属性: //先绘制一个图形. ctx.fillStyle = "#00ff00"; ctx.fillRect(10,10 ...

  7. PDA手持终端在ERP系统仓库管理出入库盘点环节的应用

    PDA手持终端在ERP系统仓库管理出入库盘点环节的应用 传统库存管理的数据录入过程,常采用PC机录入数据,或在电脑上结合条码枪扫描条码进行管理(非实时),造成管理上的不便.因而,采用无线(WIFI)手 ...

  8. Div 添加阴影

    <style type="text/css">.mydiv{   width:250px;height:auto;border:#909090 1px solid;ba ...

  9. 10686 DeathGod不知道的事情

    Description 蚂蚁是很强大的动物,除了DeathGod知道的事情外还有很多不知道的!例如… 根据某种理论,时间方向上有无数个平行世界,有的世界蚂蚁很多,有的世界蚂蚁很少,有的世界蚂蚁会繁殖, ...

  10. http://jingyan.baidu.com/album/03b2f78c4cc0ad5ea337ae7d.html

    http://jingyan.baidu.com/album/03b2f78c4cc0ad5ea337ae7d.html