惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

WordPress大学
WordPress大学
O
OpenAI News
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
博客园 - 三生石上(FineUI控件)
Webroot Blog
Webroot Blog
GbyAI
GbyAI
S
SegmentFault 最新的问题
Cyberwarzone
Cyberwarzone
Exploit-DB.com RSS Feed
Exploit-DB.com RSS Feed
J
Java Code Geeks
Google DeepMind News
Google DeepMind News
cs.CV updates on arXiv.org
cs.CV updates on arXiv.org
博客园 - 【当耐特】
S
Secure Thoughts
酷 壳 – CoolShell
酷 壳 – CoolShell
AWS News Blog
AWS News Blog
Engineering at Meta
Engineering at Meta
S
Security Affairs
H
Help Net Security
Microsoft Security Blog
Microsoft Security Blog
D
DataBreaches.Net
云风的 BLOG
云风的 BLOG
Hugging Face - Blog
Hugging Face - Blog
Google DeepMind News
Google DeepMind News
Spread Privacy
Spread Privacy
T
Threatpost
Forbes - Security
Forbes - Security
C
Cisco Blogs
Scott Helme
Scott Helme
Attack and Defense Labs
Attack and Defense Labs
Simon Willison's Weblog
Simon Willison's Weblog
腾讯CDC
The Last Watchdog
The Last Watchdog
Cloudbric
Cloudbric
Last Week in AI
Last Week in AI
Recorded Future
Recorded Future
小众软件
小众软件
V
Vulnerabilities – Threatpost
美团技术团队
人人都是产品经理
人人都是产品经理
有赞技术团队
有赞技术团队
Apple Machine Learning Research
Apple Machine Learning Research
Hacker News - Newest:
Hacker News - Newest: "LLM"
I
Intezer
月光博客
月光博客
C
Cyber Attacks, Cyber Crime and Cyber Security
博客园 - 司徒正美
C
Cybersecurity and Infrastructure Security Agency CISA
Martin Fowler
Martin Fowler
博客园 - 聂微东

博客园 - 冯岩

RSA算法 Android JAVA C#互通 LINQ TO SQL 动态查询 ASPX多服务器控件下使用Jquery.validate.js 接受来自服务器的数据连接时发生超时(30000 毫秒)问题原因及解决方法 防止网页被客户端IE缓存 dottext阅读之系统调度分析 Javascript对日期的操作 C#读取被进程占用的文件 SqlServer 无日志文件附加 windows2003远程桌面退出后系统自动注销的解决方法 JS获取触发事件元素的方法 JS处理选取值 Marquee首尾相连不间断移动 开始完全显示 c#将数据导入Excel另类方法 windows Server 2008常见问题及解决方法 .NET 特性Attribute[三] .NET 特性Attribute[二] .NET 特性Attribute[一] [安装程序配置服务器失败]解决SQL Server2000安装失败
jquery.autocomplete.js 插件的自定义搜索规则
冯岩 · 2009-09-18 · via 博客园 - 冯岩

这二天开始用jquery.autocomplete这个自动完成插件。功能基本比较强大,但自己在实际需求中发现还是有一处不足!
问题是这样:当我定义了一个本地数据JS文件时,格式为JSON式的数组。如下:

var stockInfoJson = [
    { name: 
"深发展A", code: "000001",spell:"sfza" },
    { name: 
"万科A", code: "000002",spell:"wka"},
    { name: 
"ST 国 农", code: "000004",spell:"stgn" },
    { name: 
"世纪星源", code: "000005",spell:"sjxy" },
    { name: 
"深振业A", code: "000006" ,spell:"szya"},
    { name: 
"ST 达 声", code: "000007" ,spell:"stds"},
    { name: 
"ST宝利来", code: "000008" ,spell:"stbll"},
    { name: 
"中国宝安", code: "000009" ,spell:"zgba"},
    { name: 
"S ST华新", code: "000010" ,spell:"ssthx"},
    { name: 
"山航B", code: "200152" ,spell:"shb"},
    { name: 
"*ST帝贤B", code: "200160" ,spell:"stdxb"},
    { name: 
"雷伊B", code: "200168" ,spell:"lyb"},
    { name: 
"宝石B", code: "200413",spell:"bsb" },
    { name: 
"小天鹅B", code: "200418" ,spell:"xteb"},
    { name: 
"粤高速B", code: "200429" ,spell:"agsb"},
    { name: 
"宁通信B", code: "200468" ,spell:"ltxb"},
    { name: 
"晨鸣B", code: "200488" ,spell:"cmb"},
    { name: 
"珠江B", code: "200505" ,spell:"zjb"},
    { name: 
"闽灿坤B", code: "200512" ,spell:"mskb"},
    { name: 
"华电国际", code: "600027" ,spell:"hdgj"}
];

现在希望用户输入的内容在code及spell属性中进行匹配。但默认的jquery.autocomplete.js插件,当用户输入内容时总是去匹配name.
通过查看源码没有发现有对此需求进行支持的相关属性,这点倒不方便了!所以决定对jquery.autocomplete.js进行修改,使其支持自定义的匹配模式。
首先在429行添加一个事件

reasultSearch:null,// add by fengyan 添加一个自定义查询结果的事件属性

在$.Autocompleter.Cache中添加一个缓存数据变量450行

var allData = new Array();// add by fengyan 数组变量 缓存所有数据

在populate()方法中添加511行添加

allData.push(row);//add by fengyan 将每行数据存放刚才定义的数组变量中

然后再在load: function(q)方法中568行添加一个判断

//add by fengyan 调用用户自定义查询方法
else if(typeof(options.reasultSearch)=="function")
{
    
var csub = [];
    $.each(allData, 
function(i, row) {
        
var ms = options.reasultSearch(row,q);
        
if(ms!=null && ms!=false)
        {
            csub.push(ms);
        }
    });
    
return csub;            
}

然后前台调用的时候可以使用resultSearch属性进行扩展我们自己想要的查询方式

$(function(){
    $(
"#suggest1").autocomplete(stockInfoJson, {
        minChars: 
1,
        matchCase:
false,//不区分大小写
        autoFill: false,
        max: 
10,
        formatItem: 
function(row, i, max,term) {
            
var v = $("#suggest1").val();        
            
return  row.name + " (" + row.code + ")";
            
if(row.code.indexOf(v) == 0 || row.spell.indexOf(v)==0)
            {
                
return  row.name + " (" + row.code + ")";
            }
            
else
                
return false;
        },
        formatMatch: 
function(row, i, max) {
            
return row.name + " (" + row.code+")";
        },
        formatResult: 
function(row) {
            
return row.code;
        },
        reasultSearch:
function(row,v)//本场数据自定义查询语法 注意这是我自己新加的事件
        {
            
//自定义在code或spell中匹配
            if(row.data.code.indexOf(v) == 0 || row.data.spell.indexOf(v) == 0)
            {
                
return row;
            }
            
else
                
return false;            
        }
    });
});