Javascript 如何在语义用户界面中创建自动完成文本框_Javascript_Jquery_Angularjs_User Interface_Semantic Ui

Javascript 如何在语义用户界面中创建自动完成文本框

javascript jquery angularjs user-interface

Javascript 如何在语义用户界面中创建自动完成文本框,javascript,jquery,angularjs,user-interface,semantic-ui,Javascript,Jquery,Angularjs,User Interface,Semantic Ui,我正在使用语义UI自动完成文本框 $(document).ready(function(search) { $('.ui.search') .search({ source: content }); var content = [{ title: 'Andorra' }, { title: 'United Arab Emirates' }, { title: '

我正在使用语义UI自动完成文本框

$(document).ready(function(search) {
    $('.ui.search')
        .search({
            source: content
        });
    var content = [{
        title: 'Andorra'
    }, {
        title: 'United Arab Emirates'
    }, {
        title: 'Afghanistan'
    }, {
        title: 'Antigua'
    }, ];
});

这是我在Semantic UI网站上使用的代码，但我在控制台中遇到了一个错误

未捕获的TypeError:$（…）。搜索不是函数

我做错了什么？

如果以下代码对您有帮助，请尝试

<!DOCTYPE html>
<html>
<head>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.10/semantic.min.js"></script>
    <link href="http://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.10/semantic.css" rel="stylesheet"/>  
    <script type="text/javascript">

        $(document).ready(function () {
            var content = [{
                title: 'Andorra'
            }, {
                title: 'United Arab Emirates'
            }, {
                title: 'Afghanistan'
            }, {
                title: 'Antigua'
            },];

            $('.ui.search')
                .search({
                    type: 'standard',
                    source: content,
                    searchFields: ['title'],
                });

        });
    </script>

</head>
<body>
<div class="ui search">
    <div class="ui icon input">
        <input class="prompt" placeholder="Search countries..." type="text">
        <i class="search icon"></i>
    </div>
    <div class="results"></div>
</div>
</body>
</html>


$（文档）.ready（函数（）{
变量内容=[{
标题：“安道尔”
}, {
标题：“阿拉伯联合酋长国”
}, {
标题：“阿富汗”
}, {
标题：“安提瓜”
},];
$（'.ui.search'）
.搜索({
类型：“标准”，
资料来源：内容，
搜索字段：['title']，
});
});

如果以下代码对您有帮助，请尝试

<!DOCTYPE html>
<html>
<head>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.10/semantic.min.js"></script>
    <link href="http://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.10/semantic.css" rel="stylesheet"/>  
    <script type="text/javascript">

        $(document).ready(function () {
            var content = [{
                title: 'Andorra'
            }, {
                title: 'United Arab Emirates'
            }, {
                title: 'Afghanistan'
            }, {
                title: 'Antigua'
            },];

            $('.ui.search')
                .search({
                    type: 'standard',
                    source: content,
                    searchFields: ['title'],
                });

        });
    </script>

</head>
<body>
<div class="ui search">
    <div class="ui icon input">
        <input class="prompt" placeholder="Search countries..." type="text">
        <i class="search icon"></i>
    </div>
    <div class="results"></div>
</div>
</body>
</html>


$（文档）.ready（函数（）{
变量内容=[{
标题：“安道尔”
}, {
标题：“阿拉伯联合酋长国”
}, {
标题：“阿富汗”
}, {
标题：“安提瓜”
},];
$（'.ui.search'）
.搜索({
类型：“标准”，
资料来源：内容，
搜索字段：['title']，
});
});

是否加载了插件？是否正确加载了jQuery或其他插件？如果您正在使用Chrome，请检查网络选项卡，查看在尝试加载时是否有任何文件出现错误。是的，包括。。。。这些是我包含的库。是否有其他库要包含？是否必须包含除此之外的任何其他库或任何语法错误？网络正常你是否加载了插件？你是否正确加载了jQuery或其他插件？如果您正在使用Chrome，请检查网络选项卡，查看在尝试加载时是否有任何文件出现错误。是的，包括。。。。这些是我包含的库。是否有其他库要包含？是否必须包含除此之外的任何其他库或任何语法错误？网络还可以