JQuery 自动完成列表获取 Json 项答案

【问题标题】：JQuery Autocomplete List get Json ItemJQuery 自动完成列表获取 Json 项
【发布时间】：2016-01-04 09:59:10
【问题描述】：

我使用 JQuery 自动完成列表。但我无法从本地 json 文件中获取数据。我能怎么做？我想在我的 json 数据中搜索产品字段。

js 函数。

$( "#autocomplete" ).on( "filterablebeforefilter", function ( e, data ) {
        var $ul = $( this ),
            $input = $( data.input ),
            value = $input.val(),
            html = "";
        $ul.html( "" );
        if ( value && value.length > 2 ) {
            $ul.html( "<li><div class='ui-loader'><span class='ui-icon ui-icon-loading'></span></div></li>" );
            $ul.listview( "refresh" );
            $.ajax({
                url: "file:///D:/projects/phonegap/Genuis_Market/www/products",
                dataType: "jsonp",

                data: {
                    q: $input.val()
                }
            })
            .then( function ( response ) {
                $.each( response, function ( i, val ) {
                    html += "<li>" + val + "</li>";
                });
                $ul.html( html );
                $ul.listview( "refresh" );
                $ul.trigger( "updatelayout");
            });
        }
    });

json 数据

{"Code":2376,"Bar Code":"[ 7896194400046 ]","Product":" ACUCAR MASCAVO NATU´S","Stock":null,"Supplier":null,"Departament":"MERCEARIA","Price":6.99," ": ,"Weight":0,"Promotion":"0 Un"},
{"Code":2187,"Bar Code":"[ 8076809529433 ]","Product":" BARILLA INTEGRALE PENNETTE RIGATE","Stock":null,"Supplier":null,"Departament":"MERCEARIA","Price":8.35," ": ,"Weight":0,"Promotion":"0 Un"},
{"Code":1072,"Bar Code":"[ 7891095154296 ]","Product":" CANELA DA CHINA 8G","Stock":null,"Supplier":null,"Departament":"MERCEARIA","Price":3," ": ,"Weight":0,"Promotion":"0 Un"},
{"Code":2249,"Bar Code":"[ 7891150029606 ]","Product":" SHAMPOO TRESEMME BLINDAGEM PLATINUM","Stock":null,"Supplier":null,"Departament":"MERCEARIA","Price":12.53," ": ,"Weight":0,"Promotion":"0 Un"},
{"Code":1464,"Bar Code":"[ 7896005801826 ]","Product":"3 CORAÇOES EXTRAFORTE 500G","Stock":null,"Supplier":null,"Departament":"MERCEARIA","Price":8.49," ": ,"Weight":0,"Promotion":"0 Un"},
{"Code":1173,"Bar Code":"[ 7896209400771 ]","Product":"7 GRAOS INTEGRAL 400G","Stock":null,"Supplier":null,"Departament":"MERCEARIA","Price":7.99," ": ,"Weight":0,"Promotion":"0 Un"},
{"Code":1174,"Bar Code":"[ 7896002366250 ]","Product":"9 GRAOS INTEGRAL 400G","Stock":null,"Supplier":null,"Departament":"MERCEARIA","Price":5.99," ": ,"Weight":0,"Promotion":"0 Un"},
{"Code":1557,"Bar Code":"[ 7501001169374 ]","Product":"ABSORVENTE ALWAYS ACTIVE 8UN","Stock":null,"Supplier":null,"Departament":"MERCEARIA","Price":5.49," ": ,"Weight":0,"Promotion":"0 Un"},
{"Code":2403,"Bar Code":"[ 7896007541874 ]","Product":"ABSORVENTE INTERNO INTIMUS SUPER","Stock":null,"Supplier":null,"Departament":"MERCEARIA","Price":5.98," ": ,"Weight":0,"Promotion":"0 Un"},
{"Code":2401,"Bar Code":"[ 7896007541867 ]","Product":"ABSORVENTE INTERNO INTIMUS SUPER C8","Stock":null,"Supplier":null,"Departament":"MERCEARIA","Price":5.89," ": ,"Weight":0,"Promotion":"0 Un"},

【问题讨论】：

由于安全原因，如果您必须这样做，则无法使用 javascript 读取本地文件，然后尝试禁用 chrome 的网络安全
您好像忘记了 url: "file:///D:/projects/phonegap/Genuis_Market/www/products", 中的 JSON 文件名
json 名称是 products.json

标签： javascript jquery json jquery-mobile

【解决方案1】：

问题是因为 Javascript 无法访问客户端上的文件系统。您可以在浏览器中禁用此功能，但很可能它不是您想要的。只需运行本地服务器并使用它请求您的json。请记住Same-origin policy。

【讨论】：