Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>JS Bin</title>
    <!-- jQuery v1.9.1 -->
    <script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
    <!-- typeahead.js v0.11.1 -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/typeahead.js/0.11.1/typeahead.jquery.min.js"></script>
</head>
<body>
    <input type="text" class="example" />
    <script>
        var substringMatcher = function( strs ) {
            return function findMatches( q, cb ) {
                var matches, substringRegex;
                matches = [];
                substrRegex = new RegExp( q, "i" );
                $.each( strs, function( i, str ) {
                    if ( substrRegex.test( str ) ) {
                        matches.push( str );
                    }
                });
                cb(matches);
            };
        };
        var states = [ "Tom", "Mike", "Jack", "Bob" ];
        $( ".example" ).typeahead({
            highlight: true, // 標註關鍵字
            minLength: 1 // 最小關鍵字長度
        },
        {
            name: "states",
            source: substringMatcher( states ) // 建議列表資料
        });
    </script>
</body>
</html>
 
​
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
hsuehmingfangpro
0viewers