Question

我正在尝试使用类别选项创建自动完成功能，但是当我使用catcomplete尝试它时，我会收到错误;

TypeError：$ .widget不是函数 “本地主机/ php25 / JS / jquery.ui.widget.js” 第67行
TypeError：base不是构造函数 “本地主机/ php25 / JS / jquery.ui.widget.js” 第67行
TypeError：$（“＃search”）。catcomplete不是函数 “本地主机/ php25 / index.php文件” 第50行

这是我的代码：

<html>
<head>
    <meta charset="utf-8">
    <title>Hello</title>
    <script type="text/javascript" src="js/jquery-1.8.2.js"></script>
    <script type="text/javascript" src="js/jquery.ui.autocomplete.js"></script>
    <script type="text/javascript" src="js/jquery.ui.core.js"></script>
    <script type="text/javascript" src="js/jquery.ui.position.js"></script>
    <script type="text/javascript" src="js/jquery.ui.widget.js"></script>

    <style type="text/css">
        .ui-autocomplete{
            padding: .2em .4em;
            margin: .8em 0 .2em;
            line-height: 1.5;
        }
    </style>

    <script type="text/javascript">
        $.widget( "custom.catcomplete", $.ui.autocomplete, {
            _renderMenu: function( ul, items) {
                var self = this, 
                currentCategory = "";
                $.each( items, function(index, item){
                    if( item.category != currentCategory){
                        ul.append( "<li class='ui-category'>" + item.category + "</li>");
                        currentCategory = item.category;
                    }
                    self._renderItem( ui, item);
                });
            }
        });
    </script>

    <script type="text/javascript">
        $( function(){
            var data =  [
                {label:"London Biggin Hill Arpt,BQH,United Kingdom",category:"airport"},
                {label:"Longvic Airport,DIJ,France",category:"airport"},
                {label:"Long Island Arpt,HAP,Australia",category:"airport"},
                {label:"Long Island Macarthur Arpt,ISP,United States",category:"airport"},
                {label:"Long Banga Airfield Arpt,LBP,Malaysia",category:"airport"},
                {label:"Longview,United States",category:"city"},
                {label:"Long Island,Australia",category:"city"},
                {label:"Long Banga,Malaysia",category:"city"},
                {label:"Long Bawan,Indonesia",category:"city"},
                {label:"Londrina,Brazil",category:"city"}
            ]; 
            $('#search').catcomplete({
                source: data 
            });
        });
    </script>
</head>

<body>
    <label for="search">Search: </label>
    <input id="search" type="text" />
</body>
</html>

我刚刚编写了类似于http://jqueryui.com/autocomplete/#categories

任何人都可以帮我解决问题。

Answer 1

您的JavaScript包含订单错误。将autocomplete.js移动到脚本标记的末尾。

带有类别选项的自动填充功能无效

1 个答案: