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

推荐订阅源

P
Palo Alto Networks Blog
大猫的无限游戏
大猫的无限游戏
Martin Fowler
Martin Fowler
GbyAI
GbyAI
CTFtime.org: upcoming CTF events
CTFtime.org: upcoming CTF events
量子位
T
The Blog of Author Tim Ferriss
Y
Y Combinator Blog
Microsoft Azure Blog
Microsoft Azure Blog
C
CERT Recently Published Vulnerability Notes
Recent Announcements
Recent Announcements
A
About on SuperTechFans
aimingoo的专栏
aimingoo的专栏
P
Privacy International News Feed
cs.CL updates on arXiv.org
cs.CL updates on arXiv.org
博客园 - 叶小钗
L
Lohrmann on Cybersecurity
G
GRAHAM CLULEY
T
The Exploit Database - CXSecurity.com
Hugging Face - Blog
Hugging Face - Blog
P
Proofpoint News Feed
NISL@THU
NISL@THU
博客园 - Franky
C
Cybersecurity and Infrastructure Security Agency CISA
The Register - Security
The Register - Security
M
MIT News - Artificial intelligence
Know Your Adversary
Know Your Adversary
A
Arctic Wolf
F
Full Disclosure
T
Threat Research - Cisco Blogs
P
Privacy & Cybersecurity Law Blog
The Hacker News
The Hacker News
博客园 - 【当耐特】
D
Docker
T
Tailwind CSS Blog
S
SegmentFault 最新的问题
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
Jina AI
Jina AI
Help Net Security
Help Net Security
V
Visual Studio Blog
小众软件
小众软件
B
Blog
Vercel News
Vercel News
云风的 BLOG
云风的 BLOG
N
News and Events Feed by Topic
Forbes - Security
Forbes - Security
N
Netflix TechBlog - Medium
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
C
Cisco Blogs
Security Archives - TechRepublic
Security Archives - TechRepublic

博客园 - 冯岩

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;            
        }
    });
});