Question

我使用previous SO question上的帮助创建了包含图片的地图。

虽然使用jQuery UI的修复程序在JS Fiddle中正常工作，但当我在我的实际网站上尝试时，它无法正常工作。相反，我得到的是

jQuery.Deferred exception: jQuery(...).draggable is not a function
TypeError: jQuery(...).draggable is not a function

我真的把那个JS Fiddle的内容添加到我的网站上，所以问题可能在于我如何链接到jQuery / jQuery UI文件。

编辑：我已经更新了jQuery链接，以完全匹配上面JSfiddle中使用的版本。

<script src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.min.js"></script>

这已经在another thread中被问及并回答了，但问题是jQuery工具，我不相信我会使用它。

编辑2：我能够在空白的HTML文件上重新创建地图，所以我想知道它是否与我当前的网站设置有关。我使用的是Wordpress，但我并不知道任何WP / jQuery UI特定问题。

Answer 1

＆＃13;

jQuery(document).ready(function() {
    jQuery("#map").draggable(); 
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div id="range">
    <img src="https://d30y9cdsu7xlg0.cloudfront.net/png/127459-200.png" id="map" />
</div>

＆＃13;

试一下

如果您根据jquery版本加载jqueryui，也会出现此问题

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

Answer 2

我发现问题在于我只是简单地链接到jQuery UI，就像在没有CMS的网站上那样。但是，由于该站点是在Wordpress上构建的，我应该正确地将脚本排入队列。

关于如何执行此操作的Wordpress主题：https://developer.wordpress.org/reference/functions/wp_enqueue_script/

虽然为了简化在构建的这个阶段，并澄清它的工作原理，我使用了这个插件：https://wordpress.org/plugins/enqueue-me/

jQuery（...）。draggable不是一个函数

2 个答案: