Question

我在网页上显示这个JQuery AJAX时遇到了问题。

$(document).ready(function(e) {
    $(".autocomp").autocomplete(
         {
             source: function( request, response ) {
                         $.ajax({
                              url: "/apples",
                              dataType: "json",
                              data: {
                                 srch:request.term
                              },
                              success: function( data ) {
                                   response( $.map( data.result, function( item ) {
                                       return {
                                          label: item.name,    
                                          value: item.name,
                                          data: item
                                        };
                                    }));
                               }
                          });
                     },
                     minLength: 2,
                     select: function(event, ui){
                                  var parts = this.name.match(/(\D+)(\d+)$/);
                                  $("key_"+parts[2]).val(ui.item.data.key);
                               }
                    }); 
});

该函数调用返回信息的网站：{result: [{name:macintosh,key:1},{name:golden,key:2},{name:fuji,key:3}]}。在数据字段中发回的对象是：

Object {result= [Object{name:macintosh,key:1},Object{name:golden,key:2},Object{name:fuji,key:3}]}

HTML：

<input type="text" name="name_1" id="name_1" class="autocomp"><input type="hidden" name="key_1" id="key_1">

任何人都知道它为什么不起作用？我正在导入

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script>

和样式表：

<link href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />

非常感谢任何帮助！

Answer 1

此解决方案来自WebTuts站点。它现在有效，但它不使用AJAX调用 - 我仍然想知道该怎么做。这是一个解决方案，并完成相同的结果，但没有明确回答如何使用AJAX的问题。用这个seciton替换$ .ajax部分。

$.getJSON("/apples?srch="+request.term,request,
                        function(data){
                            var names = [];
                            $.each(data.result, function(i, val){
                                names.push({
                                    label: val.name,
                                    value: val.name,
                                    data: val
                                });
                            });
                            response(names);
                        });

谢谢大家！乔恩

JQuery自动完成未在页面上显示

1 个答案: