码迷,mamicode.com
首页 > Web开发 > 详细

jquery.autocomplete.js 两种实现方法

时间:2015-08-03 16:14:45      阅读:107      评论:0      收藏:0      [点我收藏+]

标签:

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

        $(function () {
            /*
            $.ajax({
            type: "POST",
            contentType: "application/json",
            url: "AjaxPage.aspx/GetAllHints",
            data: "{}",
            dataType: "json",
            success: function (msg) {
            var datas = eval(‘(‘ + msg.d + ‘)‘);
            $("#keywords").autocomplete(
            datas,
            {
            minChars: 1,
            matchCase: false, //不区分大小写
            autoFill: false,
            max: 10,
            formatItem: function (row, i, max) {
            return "<table width=‘100%‘ border=‘0‘ cellspacing=‘0‘ cellpadding=‘0‘><tr><td align=‘left‘ height=‘24‘><b>" + row.name + "</b></td><td align=‘right‘><font style=‘color: #009933; font-family: 黑体; font-style: italic‘>约" + row.count + "个宝贝</font>&nbsp;&nbsp;</td></tr></table>";
            },
            formatMatch: function (row, i, max) {
            return row.name;
            },
            formatResult: function (row) {
            return row.name;
            },
            reasultSearch: function (row, v)//本场数据自定义查询语法 注意这是我自己新加的事件
            {
            //自定义在code或spell中匹配
            if (row.data.code.indexOf(v) == 0 || row.data.spell.indexOf(v) == 0 || row.data.name.indexOf(v) == 0) {
            return row;
            }
            else {
            return false;
            }
            }
            }).result(function (event, data, formatted) {
            var encodeKeyword = encodeURIComponent(encodeURIComponent(data.name));
            searchParams = "keyword=" + encodeKeyword;
            window.location.href = "http://localhost/products.aspx?" + searchParams;
            });
            }
            });
            */

            $("#keywords").autocomplete(
                "SearchHanle.ashx",
                {
                    minChars: 1,
                    matchCase: false, //不区分大小写
                    autoFill: false,
                    max: 10,
                    parse: function (data) {
                        var d = eval("(" + data + ")"); //此处要用eval函数;
                        var rows = new Array();
                        for (var i = 0; i < d.length; i++) {
                            rows[rows.length] = {
                                data: d[i],
                                value: d[i].code,
                                result: d[i].name
                            }
                        }
                        return rows;
                    },
                    formatItem: function (row, i, max) {
                        return "<table width=‘100%‘ border=‘0‘ cellspacing=‘0‘ cellpadding=‘0‘><tr><td align=‘left‘ height=‘24‘><b>" + row.name + "</b></td><td align=‘right‘><font style=‘color: #009933; font-family: 黑体; font-style: italic‘>约" + row.count + "个宝贝</font>&nbsp;&nbsp;</td></tr></table>";
                    },
                    formatMatch: function (row, i, max) {
                        return row.name;
                    },
                    formatResult: function (row) {
                        return row.name;
                    },
                    reasultSearch: function (row, v)//本场数据自定义查询语法 注意这是我自己新加的事件
                    {
                        //自定义在code或spell中匹配
                        if (row.data.code.indexOf(v) == 0 || row.data.spell.indexOf(v) == 0 || row.data.name.indexOf(v) == 0) {
                            return row;
                        }
                        else {
                            return false;
                        }
                    }
                }).result(function (event, data, formatted) {
                    var encodeKeyword = encodeURIComponent(encodeURIComponent(data.name));
                    searchParams = "keyword=" + encodeKeyword;
                    window.location.href = "http://localhost/products.aspx?" + searchParams;
                });
        });
</script>

先记一下,方法二是存在bug的。

jquery.autocomplete.js 两种实现方法

标签:

原文地址:http://www.cnblogs.com/superfeeling/p/4699275.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!