Question

我只是尝试实现json tag editor来创建标记编辑器。我想在更大的laravel项目中实现它。因此我包含了jQuery，以及json标签编辑器中的js和css文件。所有加载都很好，我在网络标签下找到了。

现在我有：

输入元素：

<input id="keywords" class="form-control" name="keywords"
                                           autofocus></div>

在我的页面顶部：

$().ready(function(){          
     $('#keywords').jsonTagEditor();
});

但我得到一个错误说 Uncaught TypeError: $(...).jsonTagEditor is not a function ...

正如我所说，我可以在网络选项卡中看到文件的加载...

任何想法可能是什么问题？

为了使一切清楚，我使用了laravel，因此这些文件都包含在master-layout文件中，我试图在扩展这个主模板的文档中使用它。但是我不应该改变任何东西，因为我已经在使用其他一些工作正常的插件。

有什么想法吗？

Answer 1

在聊天中进行了一些讨论之后，问题变成了可疑的重新导入和重新初始化jQuery。 Laravel框架有自己的jQuery导入，通过require()发生，这是在导入问题的插件之后发生的。

将插件导入移到<body>的末尾，但是另外插件（在撰写本文时）有一个错误，必须使用传入的空对象（或者可能是其他任何其他对象）进行初始化值）：

$("#keywords").jsonTagEditor({});

Answer 2

您遗失document并且只是为了确保该元素可以访问，将您的脚本放在结束'</body>'标记之前，以便首先加载您的网页内容。

$(document).ready(function(){          
    $('#keywords').jsonTagEditor();
});

Answer 3

你忘了写文件

而不是这个

$().ready(function(){});

使用此

$(document).ready( () => {});

=>表示您使用JS的最新标准