jQuery Text Completer

时间:2012-01-31 02:00:23

标签: javascript jquery autocomplete

我想在表单的字段中添加文本完成符。我真的不知道他们怎么称呼它,我只是认为最接近的将是“文本完成者”。

我想要它做的很简单。假设我想写“破碎的DC杰克”。我希望我的代码开始猜测我要写的内容,并在写“Broken”时给我最多3个选项。例; “破碎的CPU”,“破碎的记忆”,“破碎的DC杰克”所以我可以选择我想要的,然后我不必继续写整个短语,它自我补充。

3 个答案:

答案 0 :(得分:3)

如果你不想实现自己的。 jQueryUI有一个相当不错的自动完成功能和示例。

http://jqueryui.com/demos/autocomplete/

<script>
    $(function() {
        var availableTags = [
            "ActionScript",
            "ColdFusion",
            "Erlang",
            "Fortran",
            "Groovy",
            "Haskell",
            "Java",
            "JavaScript",
            "Lisp",
            "Perl",
            "PHP",
            "Python",
            "Ruby",
            "Scala",
            "Scheme"
        ];
        $( "#tags" ).autocomplete({
            source: availableTags
        });
    });
    </script>



<div class="demo">

<div class="ui-widget">
    <label for="tags">Tags: </label>
    <input id="tags">
</div>

</div><!-- End demo -->



<div class="demo-description" style="display: none; ">
<p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are tags for programming languages, give "ja" (for Java or JavaScript) a try.</p>
<p>The datasource is a simple JavaScript array, provided to the widget using the source-option.</p>
</div><!-- End demo-description -->

答案 1 :(得分:1)

它被称为auto-complete

JQuery UI有这个小部件,请检查this

答案 2 :(得分:1)