夜光带你走进jquery UI （九）擅长的领域

最新推荐文章于 2019-12-03 19:45:09 发布

GeniusTeam-夜光

最新推荐文章于 2019-12-03 19:45:09 发布

阅读量114

点赞数

分类专栏： Genius-Jquery UI

本文链接：https://blog.csdn.net/weixin_41987706/article/details/102715897

版权

Genius-Jquery UI 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

夜光序言：

不见的时候，万般想念，有种失落感;见到了，千言万语，却闭口不谈。

原来，那份灵动从未消失，一直藏在彼此的心里面。

正文：

jQuery UI API - 自动完成部件（Autocomplete Widget）

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>夜光：自动完成部件（Autocomplete Widget）演示</title>
    <link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css">
    <script src="//apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
</head>
<body>

<label for="autocomplete">选择一个编程语言：</label>
<input id="autocomplete">

<script>
    var tags = [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby" ];
    $( "#autocomplete" ).autocomplete({
        source: function( request, response ) {
            var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( request.term ), "i" );
            response( $.grep( tags, function( item ){
                return matcher.test( item );
            }) );
        }
    });
</script>

</body>
</html>