javascript - 如何在语义ui的文本框中创建自动完成

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

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

这是我从语义UI网站使用的代码，但是在控制台中出现错误，

未捕获的TypeError：$（...）。search不是函数

我究竟做错了什么？

最佳答案

请尝试以下代码是否对您有所帮助。

<!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>