为jquery.AutoComplete添加触发事件

上次为jQuery.AutoComplete加上了提示的功能，详情请访问我的博客：《如何让jquery.Autocomplete支持提示？》，这一次，我需要再给jQuery.autoComplete添加一个onBegin的参数，什么意思呢？

我们知道这个插件有一个extraParams的参数，因为jquery.autoComplete只支持q和limit两个参数，假如有这样的情况，我们需要向服务器提交更多参数怎么办呢，幸好，作者为我们提供一个扩展参数，就是extraParams。extraParams好是好，可是不幸的是，它是一个死的参数，有时候，我们需要提交一个活的参数到服务器。举例说明，比如说我们有一个公司名称的自动完成功能，但我们同时需要向服务器提供一个城市的参数，正常的情况下没有问题。但当城市的名称是由用户选择的时候，就有问题了，也就说，这个城市的名称是根据用户选择而实时变化的，这个时候，现有的jquery.autoComplete就无能为力了。

这个时候我们就要考虑修改修改一下jquery.autoComplete了，我们先看一下代码，代码有一个onChange事件，这是一个解发事件，我们可以在这里添加一个回调函数来解决问题。首先我们要为options中添加一个参数叫onBegin，大致就在400行左右吧，有一行这样的代码：

$.Autocompleter.defaults =

我们在后面添加一段

onBegin: null,

然后我们找到onChange事件，约在226行，代码如下：

function onChange(crap, skipPrevCheck)

在函数时里面添加如下代码：

            if (options.onBegin) {var op = options.onBegin(options);if (op) {$.extend(options, op);}}

这段代码被修改过后看起来就像这样：

function onChange(crap, skipPrevCheck) {//2010-01-27 by conis，添加onBegin函数，以便在启动onChange的时候，可以重新设置optionsif (options.onBegin) {var op = options.onBegin(options);if (op) {$.extend(options, op);}}//endif (lastKeyPressCode == KEY.DEL) {select.hide();return;}var currentValue = $input.val();if (!skipPrevCheck &amp;&amp; currentValue == previousValue)return;previousValue = currentValue;currentValue = lastWord(currentValue);if (currentValue.length &gt;= options.minChars) {$input.addClass(options.loadingClass);if (!options.matchCase)currentValue = currentValue.toLowerCase();request(currentValue, receiveData, hideResultsNow);} else {stopLoading();select.hide();}};

再来看调用：

 $("#txtName").autocomplete(data, {caption: "输入中文/全拼/简拼/英文，使用↑↓可以选择",mustMatch: true,width: 260,max: 10,onBegin: function(options) {var city= $("#txtCity").val();if (city&amp;&amp; city!= "")options.extraParams.city= city;return options;}
});

什么意思呢，其实做的只有三步：

在options中添加一个onBegin的参数
在onChange中判断onBegin是否有赋值，如果有，则调用这个函数，返回将返回值合并到options中去
调用的时候，在onBegin函数中添加一些业务逻辑，并可以重新设置options

就这样，我们不仅可以达到动态去添加extraParams参数，而且还可以动态地修改其它options参数，这个onBegin在用户改变输入框的值就会触发。

注意：本文为我的独立博客镜像博客，自发表不再更新，原文可能随时被更新，敬请访问原文。同时，请大家不要在此评论，如果有什么看法，请点击这里：http://iove.net/1705/

本文来自http://iove.net，欢迎转载，转载敬请保留相关链接，否则视为侵权，原文链接：http://iove.net/1705/

转载于:https://www.cnblogs.com/conis/archive/2010/01/27/1720396.html

为jquery.AutoComplete添加触发事件相关推荐

jquery的实时触发事件(textarea实时获取中文个数)
jquery的实时触发事件(textarea实时获取中文个数) (2014-09-16 11:49:50) 转载▼ 标签: 实时触发事件中文个数 onpropertychange oninput o ...
JQuery 自己主动触发事件
经常使用模拟有时候,须要通过模拟用户操作,来达到单击的效果.比如在用户进入页面后,就触发click事件,而不须要用户去主动单击. 在JQuery中.能够使用trigger()方法完毕模拟操作.比如能 ...
laravel 添加触发事件
laravel事件主要包括事件类(app/Events下面),监听器 (app/Listeners),绑定事件和监听 1. 事件类一般格式如下: class TestEvent {use Seria ...
jquery实现回车键触发事件
键盘事件有3: keydown,keypress,keyup,分别是按下,按着没上抬,上抬键盘 . 正确代码为: $(document).keyup(function(event){if(event. ...
[jquery]为jQuery.ajax添加onprogress事件
原理: 给XMLHttpRequest对象的upload属性绑定onprogress方法监听上传过程 var xhr = new XMLHttpRequest(); xhr.upload.onpro ...
解决jquery.autocomplete在IE6下被下拉框遮住的问题
jquery.autocomplete是一个让人又爱又恨的东东,一直用得不错,可是用得越是深入就越是郁闷,这不,之前发现并解决了两个问题,这次又有问题找上我了.之前的两个问题分别是:<为jque ...
[unreal4入门系列之十四] 在UE4中添加碰撞触发事件
一.在HUD中显示消息 1) 在MyHUD.h中定义一个结构来表示我们的消息: #pragma once #include "GameFramework/HUD.h" #inclu ...
SRPG游戏开发（六十）第十一章地图动作与地图事件 - 九触发事件与切换回合(Trigger Events and Change Turn)
返回<SRPG游戏开发>导航第十一章地图动作与地图事件(Map Action and Map Event) 我们已经有了剧本,而且可以运行剧本,但我们还缺少对地图的操作控制. 我们这一 ...
autocomplete触发事件_修改jQuery.autocomplete中遇到的键盘事件
修改jQuery.autocomplete中遇到的键盘事件 autocomplete是一个jquery的自动完成插件,http://www.pengoworks.com/workshop/jquery ...

为jquery.AutoComplete添加触发事件

为jquery.AutoComplete添加触发事件相关推荐

最新文章

热门文章