Materialize.css 自动完成不适用于 Polymer

Question

我正在尝试将 Materialize.css autocomplete 用于我的 Polymer 项目。

控制台日志：

Uncaught TypeError: $(...).autocomplete is not a function

我的代码：

<div class="input-field">
    <input type="text" id="assemp" class="autocomplete" value="{{emps::input}}">
    <label for="assemp">Assigned Employee(s)</label>
</div>

脚本：

attached : function() {
            $('input.autocomplete').autocomplete({
                data: {
                    "Apple": null,
                    "Microsoft": null,
                    "Google": 'http://placehold.it/250x250'
                }
            });
        }

Answer 1

确保您加载的是最新的 materialize.js 文件。我有一个旧版本，自动完成插件不在 JS 中，它抛出同样的错误。我更新后就走了。但是我仍然无法让自动完成工作。 :(

Answer 2

我的解决方法：

复制函数：

/**************************
* Auto complete plugin  *
*************************/

$.fn.autocomplete = function (options) {
// Defaults
var defaults = {
    data: {}
};

options = $.extend(default

(...)

}); // End of $(document).ready (1)

/*******************
 *  Select Plugin  *
 ******************/

来自 materialize.js（行号~3000）要么来自源文件 /js/forms.js（行号~281）

删除最后一行：

}); // End of $(document).ready (1)

它的关闭功能开始得更多...

并将其手动放入您的 javascript 函数体中

$(document).ready(function() { 
//paste it here
})

Answer 3

我运行遇到了与 React 类似的问题。如果我在 jquery 内执行代码，它似乎可以工作。

$(() => {
  $(...).autocomplete();
});

Answer 4

 $(document).ready(function () {$('input.autocomplete').autocomplete({
            data: {
                "Apple": null,
                "Microsoft": null,
                "Google": null
            }});});

Answer 5

通过将我的 jQuery 版本降级到 Materialise CSS 使用的 V2.1.4 解决了我的问题。

Answer 6

是的，正如Wesley Williams`之前提到的，Materialise JS文件的版本很重要！我有这个版本 0.97.3 的 js 文件，我永远无法得到一个简单的标准示例来工作。

最后发现是这个版本不支持autocomplete功能，只好升级到最新版本，效果很好

Materialize.css 自动完成不适用于 Polymer

Materialize.css autocomplete not working with Polymer

javascript

jquery

materialize

polymer

polymer-1.0