《搜索的联想功能》

简介:

很简单的一个联想功能,直接贴代码!

复制代码
$(function () {
    autoThink();
    
})

function autoThink() {
    var productArry = ["iphone6Plus", "mx3", "mx4", "mi3", "mi4", "minote"];
    var showArry = [];
    $("#serach").keyup(function () {
        showArry.splice(0, showArry.length); //清空数组 
        var searchVal = $(this).val();
        for (var i = 0; i < productArry.length; i++) {
            if (productArry[i].match(searchVal)) {
                showArry.push(productArry[i]);
            }
        }
        var innerhtml = "";
        innerhtml += "<ul style='list-style:none';font-size:13px>";
        for (var j = 0; j < showArry.length; j++) {
            innerhtml += "<li class='attchColor' onclick='getLi(this)' style=' cursor:pointer;'> " + showArry[j] + "</li>";
        }
        innerhtml += "</ul>";
        $("#autoLi").html(innerhtml);
        $("#autoLi").css("display","block");
    })

    $("#autoLi").focusout(function () {
        $("#autoLi").css("display", "none");
   })
    
        
}

function getLi(obj) {
    $("#serach").val(obj.innerHTML);
}
复制代码

这里涉及到几个知识点:正则表达式,match()的使用。正则表达式在我前面的文章里面有了较为详细的说明,这里不再赘述!

下面说说match();

1.老规矩先:定义与用法

match() 方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。

该方法类似 indexOf() 和 lastIndexOf(),但是它返回指定的值,而不是字符串的位置。

2.语法:

stringObject.match(searchvalue)
stringObject.match(regexp)

3.参数

(searchvalue,regexp)
 searchvalue:必需。规定要检索的字符串值。
 regexp:必需。规定要匹配的模式的 RegExp 对象。如果该参数不是 RegExp 对象,则需要首先把它传递给 RegExp 构造函数,将其转换为 RegExp 对象。

4.实例:

a:

复制代码
<script type="text/javascript">

var str="Hello world!"
document.write(str.match("world") + "<br />")
document.write(str.match("World") + "<br />")
document.write(str.match("worlld") + "<br />")
document.write(str.match("world!"))

</script>

//对Hello world!进行检索

//输出
world
null
null
world!
复制代码

b:

复制代码
<script type="text/javascript">

var str="1 plus 2 equal 3"
document.write(str.match(/\d+/g))

</script>
//使用全局匹配的正则表达式来检索字符串中的所有数字

//输出
1,2,3
复制代码

说明:其中g是对所有进行检索 其中涉及到简单的正则

转载:http://www.cnblogs.com/zqzjs/p/4507703.html

目录
相关文章
|
8月前
|
数据采集 人工智能 搜索推荐
智能开放搜索
智能开放搜索
358 0
|
12月前
|
小程序 数据库
小程序搜索功能,云开发搜索,小程序云开发模糊搜索,同时搜索多个字段
小程序搜索功能,云开发搜索,小程序云开发模糊搜索,同时搜索多个字段
242 0
|
搜索推荐 SEO
怎样做好搜索下拉优化?百度搜索推荐词的推广方式
怎样做好搜索下拉优化?百度搜索推荐词的推广方式
186 0
小技巧 - 一键屏蔽百度搜索出现百家号信息的方法
小技巧 - 一键屏蔽百度搜索出现百家号信息的方法
518 0
小技巧 - 一键屏蔽百度搜索出现百家号信息的方法
|
机器学习/深度学习 自然语言处理 搜索推荐
游戏行业搜索最佳实践
本文通过游戏行业客户案例带大家了解游戏内容,游戏论坛等场景搜索特性,以及如何通过开放搜索游戏增强版解决方案轻松快速接入,实现高质量搜索效果,提升业务指标和用户体验。
649 0
|
前端开发 JavaScript 搜索推荐
如何正确的使用百度精准搜索
如何正确的使用百度精准搜索
408 0
|
自然语言处理 算法 知识图谱
电商搜索如何“想用户所想,提高搜索结果质量”?
本文针对电商搜索中如何“想用户所想,提高搜索结果质量”的问题进行剖析,并通过阿里云开放搜索电商行业解决方案和大家聊一聊如何优化解决~
3741 0
电商搜索如何“想用户所想,提高搜索结果质量”?
|
索引 搜索推荐 自然语言处理
就是这么迅猛的实现搜索需求
你的搜索架构到了哪一个阶段?数据量、并发量、好的经验欢迎分享?
547 0
|
自然语言处理 搜索推荐 PHP
阿里云开放搜索实践,使用阿里云开放搜索来做网站站内搜索
阿里云的开放搜索已经做得很完善了,现在阿里云集成了开放搜索,只要定义好表结构,上传数据,就会自动生成索引,马上就可以搜索了,简直可以做个搜索引擎了。一起来看看。 阿里云开放搜索介绍及购买页 首先,创建一个应用 表结构很简单,就一个主键id,一个text字段msg 添加数据源,数据源可...