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 ...
随机推荐
- dive into python 读笔(1)
chapter2 and 3: 使用Python IDE来交互式地测试表达式 编写Python程序并且从IDE运行,或者从命令行运行 导入模块及调用它们的函数 声明函数以及doc string.局部变 ...
- UITableView实现格瓦拉飞天投票模块-b
格瓦拉目前来说动画效果确实做的还比较好,虽然不是说很炫但做到精致,这次就模仿了它投票的模块.其实想到要实现它还是有很多方法,不过这次我还是采用了苹果自带控件UITableView简简单单来实现它,再次 ...
- html 设置Select options值进行绑定
<select id="cdms"> <option value="">请选择...</option> <option ...
- fzu 2105 Digits Count ( 线段树 ) from 第三届福建省大学生程序设计竞赛
http://acm.fzu.edu.cn/problem.php?pid=2105 Problem Description Given N integers A={A[0],A[1],...,A[N ...
- 小小地预览HTML5
程序示例 <!doctype html> <html> <head> <title>First </title> <meta char ...
- c#用反射原理递归遍历复杂实体对象
之前在网上看到的都是遍历那种比较简单的实体对象,但是如果有实体嵌套,甚至是包含有List<XXInfo>这种属性的时候就没有办法处理了.通过递归遍历的方式可以完成对复杂实体对象的所有属性的 ...
- Interlocked.Increment 方法 和Interlocked.Decrement 方法作用
Interlocked.Increment 方法:让++成为原子操作:Interlocked.Decrement 方法让--成为原子操作.什么叫原子操作呢.就是不会被别人打断,因为C#中的一个语句,编 ...
- 扫盲Linq知识
LINQ,语言集成查询(Language Integrated Query),是在.NET Framework 3.5 中出现的技术. 借助于LINQ技术,我们可以使用一种类似SQL的语法来查询任何形 ...
- 关于hibernate中双向外键关联one-to-one的property-ref=的问题(转)
大家都知道hibernate中的one-to-one映射主要有两种策略,(1)一对一主键关联(单向和双向).(2)一对一外键映射(单项和双向).本文主要讲解一下,一对一外键映射中的双向问题,在此前先通 ...
- python:Attempted relative import in non-package
problem:Attempted relative import in non-package 所谓相对路径其实就是相对于当前module的路径,但如果直接执行脚本,这个module的name就是“ ...