0

我想自定义jquery自动完成的搜索行为,现有代码如下

var data    = [

       {"url":"http://site/test.php",    "label":" test course"}]

             $k(".input").autocomplete({
            max:10,
            source: data,
            multipleSeparator: " ",
            select: function( event, ui ) { 
                window.location.href = ui.item.url;
            },
            appendTo: "#results",
            open: function() {
                var position = $("#results").position(),
                    left = position.left, top = position.top;

                $("#results > ul").css({left: left + 20 + "px",
                                        top: top + 4 + "px" });

            }
        });

我需要忽略数据(搜索数据)中的空格。

假设如果我输入“testcourse”,我必须得到类似“test course”的结果。

这个怎么做。

4

3 回答 3

1

data将具有空格的任何值与相同的条目复制,只有label不同的条目(没有空格)。

var data    = [
   {"url":"http://site/test.php",  "label":" test course"},
   {"url":"http://site/test.php",  "label":" testcourse"}
];

这是一种data在去除空格时可以循环并添加任何不相同的项目的方法:

for(i = 0; i < data.length; i++){
    var noWhsp = data[i].label.replace(/\s/g, '');
    if(data[i].label !== noWhsp){
        data.push({"url":data[i].url,  "label":noWhsp})
    }
}
于 2013-08-07T13:19:54.867 回答
0

只需在没有空格的数据中添加另一个 json 值。

var data    = [
   {"url":"http://site/test.php",  "label":" test course", "search_term":"testcourse"},
]; 

使用搜索词进行搜索并显示标签作为结果

或者

    var data    = [
       {"url":"http://site/test.php",  "label":" test course_testcourse"},
];

通过“_”符号听到拆分标签值并使用标签[1]搜索并获取结果值标签[0]

于 2013-08-12T06:39:41.650 回答
0

我实现了,代码如下

$k("#autocomplete").autocomplete({
        max:10,
        source: function(req, responseFn) {
            var re = $k.ui.autocomplete.escapeRegex(req.term).toUpperCase();
            re = re.replace(/\s+/g, "")
            var matcher = new RegExp(".*"+$.trim(re).replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "")+".*");
            var a = $k.grep( data, function(item,index){
                return matcher.test(item.label.toUpperCase().replace(/\s+/g, ""));
            });
         responseFn( a );
        },
        matchContains: true, 
        multipleSeparator: "",
        multiple: true,
        select: function( event, ui ) { 
            window.location.href = ui.item.url;
        },
        appendTo: "#results",
        open: function() {
            var position = $("#results").position(),
                left = position.left, top = position.top;

            $("#results > ul").css({left: left + 20 + "px",
                                    top: top + 4 + "px" });

        }
});
于 2013-08-13T04:33:58.340 回答