Jquery 打印前加载但不可见_Jquery_Typeahead.js

Jquery 打印前加载但不可见

jquery

Jquery 打印前加载但不可见,jquery,typeahead.js,Jquery,Typeahead.js,我不熟悉typeahead.js，并尝试实现一个简单的示例 <!DOCTYPE HTML> <html> <head> <script type='text/javascript' src='../libraries/jquery/jquery-2.1.0.js'></script> <script type='text/javascript' src='../libraries/type

我不熟悉typeahead.js，并尝试实现一个简单的示例

<!DOCTYPE HTML>

<html>
    <head>
        <script type='text/javascript' src='../libraries/jquery/jquery-2.1.0.js'></script>
        <script type='text/javascript' src='../libraries/typeahead/typeahead.bundle.js'></script>

        <title> CIQ-Flow </title>

    </head>

<body>
<input type='text' id="search"/>
<p> some text </p>
    <script>
$('#search').css("background-color",'blue');

$('#search').typeahead([
{
name: 'planets',
local: [ "Mercury", "Venus", "Earth", "Mars", "Jupiter", "Saturn", "Uranus", "Neptune" ]
}
]);
</script>
</body>

</html>


出入境检验检疫流程
一些文本
$（'#search'）.css（“背景色”，“蓝色”）；
$（“#搜索”）。请提前键入([
{
名称：'行星'，
本地：[“水星”、“金星”、“地球”、“火星”、“木星”、“土星”、“天王星”、“海王星”]
}
]);

上面的示例只是尝试在文本框中显示值。这应该是一个直截了当的例子，应该是有效的。不知道哪里出了问题。一些提示或建议会很有帮助。

您应该在typeahead.js中使用建议引擎（如猎犬）

下面是一个JSFIDLE，向您展示了如何实现解决方案

它是基于发现的“非常简单”的例子

代码如下：

// instantiate the bloodhound suggestion engine
var planets = new Bloodhound({
datumTokenizer: function (d) {
    return Bloodhound.tokenizers.whitespace(d.planet);
},
queryTokenizer: Bloodhound.tokenizers.whitespace,
    local: [{
        planet: "Mercury"
    }, {
        planet: "Venus"
    }, {
        planet: "Earth"
    }, {
        planet: "Mars"
    }, {
        planet: "Jupiter"
    }, {
        planet: "Saturn"
    }, {
        planet: "Uranus"
    }, {
        planet: "Neptune"
    }]
});

// initialize the bloodhound suggestion engine
planets.initialize();

// instantiate the typeahead UI
$('#typeahead').typeahead(null, {
    displayKey: 'planet',
    source: planets.ttAdapter()
});

嗨，谢谢你的回复。但是它需要在服务器端执行吗？因为，当我将你的代码复制到html文件中并执行时，我不会从文本框中得到任何反应！我也没有从控制台收到任何错误。如果您将上述代码复制到HTML文件中，您还需要确保在您的部分中包含对jQuery和typeahead.js javascript文件的引用。谢谢您的回复。我犯了一个愚蠢的错误。我的文本框有不同的ID，您在答复中更改了该ID。感谢您的帮助抱歉更改了id！很高兴我能帮助@Adithya