0

我花了好几个小时试图让各种自动完成插件与 JQuery 一起工作。

然后我找到了以下教程: How to Use the jQuery UI Autocomplete Widget

本教程较旧,使用 Jquery 1.4 和 JQuery UI 1.8。如何修改其中的 Javascript 代码使其更符合 JQuery2.0 和 JQuery UI 1.10?

<script type="text/javascript">  
$(function(){  

    //attach autocomplete  
    $("#to").autocomplete({  

        //define callback to format results  
        source: function(req, add){  

            //pass request to server  
            $.getJSON("friends.php?callback=?", req, function(data) {  

                //create array for response objects  
                var suggestions = [];  

                //process response  
                $.each(data, function(i, val){                                
                suggestions.push(val.name);  
            });  

            //pass array to callback  
            add(suggestions);  
        });  
    },  

    //define select handler  
    select: function(e, ui) {  

        //create formatted friend  
        var friend = ui.item.value,  
            span = $("<span>").text(friend),  
            a = $("<a>").addClass("remove").attr({  
                href: "javascript:",  
                title: "Remove " + friend  
            }).text("x").appendTo(span);  

            //add friend to friend div  
            span.insertBefore("#to");  
        },  

        //define select handler  
        change: function() {  

            //prevent 'to' field being updated and correct position  
            $("#to").val("").css("top", 2);  
        }  
    });                       
});  

这似乎有3个问题:

  1. 一个明显的错误是使用已从 JQuery UI-1.10 中删除的 .item。
  2. 当尝试使用这两个库的较新版本时,它会在文本框中保留默认文本。默认文本来自 JQuery-UI CSS,类似于“您有 2 个结果”。
  3. 它似乎使用JSONP。是否可以只接受 JSON?

对此的任何帮助都会很棒!

4

1 回答 1

0

是的,只需使用 JSON。

$('#someField').autocomplete({
      source: "friends.php?autocomplete=someField"
});

这将使用自动完成的附加term参数回调;并期望一个字符串数组,或具有labelvalue属性的对象。

我已将callbackparameter-name 更改为autocomplete,因为您可能拥有多个;最好使用有意义和描述性的术语。

请参阅: http ://docs.jquery.com/UI/API/1.8/Autocomplete

希望这可以帮助。

于 2013-05-07T02:48:29.080 回答