3

您好,我正在尝试使用 Jquery UI Autocomple,但遇到了一些问题。我正在使用一个由函数填充的全局数组。但是自动完成功能无法使用。这是我想如何使用这个小部件的一个小例子。

    <!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="plugins/jquery-ui-1.8.23.custom/css/ui-lightness/jquery-ui-1.8.23.custom.css"/>
        <script type="text/javascript" src="plugins/jquery-ui-1.8.23.custom/js/jquery-1.8.0.min.js"></script>
        <script type="text/javascript" src="plugins/jquery-ui-1.8.23.custom/js/jquery-ui-1.8.23.custom.min.js"></script>
        <script type="text/javascript">
            var data = [];
            $(document).ready(function(){
                //var data1 = ["Luis","DJ","Jon","Les","Jimmy"];
                $("#autocomp").autocomplete({
                    source: data
                });
            });
            function Load(){
                data =  ["luis","dj","jon","les","jimmy"];
            }
            function Alert(){
                alert(data);
            }
        </script>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body onload="Load()">
        <div>
            Type:<input type="text" id="autocomp"/>
            <button onclick="Alert()">test</button>
        </div>
    </body>
</html>

感谢您的回复

4

2 回答 2

2

初始化后修改源需要重新设置,所以你的Load函数变成这样:

 function Load(){
            data =  ["luis","dj","jon","les","jimmy"];
           $('#autocomp').autocomplete("option","source",data);
 }

带有演示的 jsfiddle

于 2012-09-05T03:08:22.430 回答
2

<body onload="Load()"> 使用 jquery 的 .ready() 或 Load()。两者都做只会让你感到困惑,因为它们确实发生在不同的时间。.ready 文档提到两者都使用不是一个好主意,前两段进一步解释了它们确实发生在不同的时间。

自动完成文档 提到,如果您更改数据列表,则需要重置它。

话虽如此,请决定您是要 onload 还是 .ready() 并在其中设置数据列表变量:)

$(document).ready(function(){
  if(!data){
data = ["Luis","DJ","Jon","Les","Jimmy"];
}
 $("#autocomp").autocomplete({
   source: data
   });
});
于 2012-09-05T03:10:44.187 回答