jQuery.autoComplete 多参数
query 版本 1.3.2
插件默认的 参数 是q 如果需要传递多个参数呢?
$("#stylistname").autocomplete("/page/autostylistname.php", {
minChars: 0,
extraParams: {shopid:function(){return $('#shopid').val();}},
width: 170,
selectFirst: false,
dataType: "json",
formatResult: function(data) { return data.name; },
parse: function(data) { return $.map(data, function(row) { return { data: row, value: row.name, result: row.name } }); },
formatItem: function(item) { if(item.jobnumber.indexOf('号')>-1){ return item.name+' '+item.jobnumber; } return item.name+' '+item.jobnumber+'号'; } });
红色部分即为需要的参数
html页面
<input id='shopid' value=''/>
在php 页就可以 用 $_GET['shopid'] 获取了
query-ui 版本 1.8.1以上
<html lang="en"><head> <meta charset="utf-8"> <title>jQuery UI Autocomplete - Remote JSONP datasource</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="//code.jquery.com/jquery-1.10.2.js"></script> <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <link rel="stylesheet" href="/resources/demos/style.css"> <style> .ui-autocomplete-loading { background: white url("images/ui-anim_basic_16x16.gif") right center no-repeat; } #city { width: 25em; } </style> <script> $(function() { function log( message ) { $( "<div>" ).text( message ).prependTo( "#log" ); $( "#log" ).scrollTop( 0 ); } $( "#city" ).autocomplete({ source: function( request, response ) { $.ajax({ url: "http://gd.geobytes.com/AutoCompleteCity", dataType: "jsonp", data: { q: request.term }, success: function( data ) { response( data ); } }); }, minLength: 3, select: function( event, ui ) { log( ui.item ? "Selected: " + ui.item.label : "Nothing selected, input was " + this.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="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div></div></body></html>jQuery.autoComplete 多参数的更多相关文章
- [转]jQuery.Autocomplete实现自动完成功能(详解)
本篇文章除了介绍jquery.autocomplete基本参数外,主要说明jquery.autocomplete的数据源的格式问题. 1.jquery.autocomplete参考地址 htt ...
- jquery.autocomplete自动补全功能
项目实例: 一:js //SupplierAutoComplete.js $().ready(function () { $("#txtSupplier").autocomplet ...
- 使用jQuery Autocomplete(自动完成)插件
jQuery 的Autocomplete(自动完成.自动填充)插件有不少,但比较下来我感觉,还是bassistance.de 的比较强大,我们就来写一些代码感受一下. 最简单的Autocomplete ...
- [Jquery] Jquery AutoComplete的使用方法实例
jQuery的Autocomplete(自动完成.自动填充)插件 jquery-autocomplete配置: <script type="text/javascript" ...
- jQuery.Autocomplete实现自动完成功能(详解)
1.jquery.autocomplete参考地址 http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/ http://do ...
- Jquery autocomplete插件的使用
简单用法: <%@ page language="java" contentType="text/html; charset=UTF-8" pageEnc ...
- 【ASP.Net MVC】在AspNet Mvc使用JQuery AutoComplete组件
在AspNet Mvc使用JQuery AutoComplete组件 官方文档: http://api.jqueryui.com/autocomplete/#entry-examples 要使用JQu ...
- Jquery AutoComplete的使用方法实例
jquery.autocomplete详解 语法: autocomplete(urlor data, [options] ) 参数: url or data:数组或者url [options]:可选项 ...
- js搜索框 js仿百度搜索 js下拉框 jQuery.Autocomplete使用
做了一个网站,需要根据文本框的输入模糊搜索数据库内容给出提示供用户选择,就找到了jQuery.Autocomplete 效果如下图: 该插件托管在github上,具体地址:https://github ...
随机推荐
- oracle中的隐式提交(auto commit)
通常我们执行sql或pl/sql时,需要我们手工提交.这样才能使所做的更改永久保存到数据库. 但有时即使我们没有在sql或pl/sql中发出commit命令,所做的更改也会被提交.这种提交是在某些特定 ...
- Linux配置Tomcat(转载)
转载自:http://www.cnblogs.com/zhoulf/archive/2013/02/04/2891633.html 安装说明 安装环境:CentOS-6.3安装方式:源码安装 软件:a ...
- ios播放声音中断后台音乐的问题
今天遇到一个ios播放声音中断后台音乐的问题,在我的app中如果调用AVAudioSession 播放完声音,后台的qq音乐偶尔不能恢复,而网易云音乐一次都不能恢复播放,研究了一下AVAudioS ...
- python中变量
在Python中,变量的概念基本上和初中代数的方程变量是一致的. 例如,对于方程式 y=x*x ,x就是变量.当x=2时,计算结果是4,当x=5时,计算结果是25. 只是在计算机程序中,变量不仅可以是 ...
- C#的历史及IDE总结
原Borland公司的首席研发设计师安德斯·海爾斯伯格(Anders Hejlsberg)在微軟開發了Visual J++ 1.0,很快的Visual J++由1.1版本升級到6.0版.SU ...
- Workspace in use or cannot be created, choose a different one.--错误解决办法
eclipse 使用一段时间后,有时会因为一些故障自己就莫名奇妙的关闭了,再打开时有时没有问题,有时有会提示错误 Workspace Unavailable: 原因:出现这种情况一般是workspac ...
- bzoj 2876: [Noi2012]骑行川藏 拉格朗日数乘
2876: [Noi2012]骑行川藏 Time Limit: 20 Sec Memory Limit: 128 MBSec Special JudgeSubmit: 1033 Solved: ...
- 团体程序设计天梯赛-练习集L1-014. 简单题
L1-014. 简单题 时间限制 400 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 陈越 这次真的没骗你 —— 这道超级简单的题目没有任何输入. ...
- 【更新链接】U盘启动制作工具(UDTOOL) v3.0.2014.0427
[校验值] 文件: UDTOOLV3_Setup.exe大小: 525 MB版本: 3.0.2014.0427时间: 2014年4月27日MD5: 2E5187B7D9081E8A69B4DC45C8 ...
- 极客范:如何使用 Cloud Insight 来监控闭路电视?
最近新上线支持 Windows 系统及其组件 监控功能的 Cloud Insight,在系统监控领域基本囊括了对所有主流和部分非主流平台的支持.但是这还不够,Cloud Insight 可不仅仅是一个 ...