首页 > 解决方案 > 尝试在 head 标记中添加hammer.js 和其他库

问题描述

我的 header.php 文件看起来像这样,但当我尝试使用hammer.js 时它不起作用。我也遇到了 jquery.hammer.customswipe 和 events.js 的错误。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="<?php bloginfo('template_directory'); ?>/scripts/jquery-scrollto.js"></script>
<script src="<?php bloginfo('template_directory'); ?>/scripts/scripts.js"></script>
<script src="<?php bloginfo('template_directory'); ?>/scripts/core/js/libraries/jquery.hammer.min.js"></script>
<script src="<?php bloginfo('template_directory'); ?>/scripts/core/js/functions/jquery.hammer.customswipe.js"></script>
<script src="<?php bloginfo('template_directory'); ?>/scripts/core/js/events.js"></script>

错误:

jquery.hammer.js:8 Uncaught ReferenceError: Hammer is not defined
    at jquery.hammer.js:8
    at jquery.hammer.js:10
(anonymous) @ jquery.hammer.js:8
(anonymous) @ jquery.hammer.js:10
jquery.hammer.customswipe.js:123 Uncaught TypeError: options.containers.hammer is not a function
    at Object.move (jquery.hammer.customswipe.js:123)
    at Object.left (jquery.hammer.customswipe.js:42)
    at init (jquery.hammer.customswipe.js:157)
    at init.$.fn.customSwipe (jquery.hammer.customswipe.js:173)
    at events.js:2
    at events.js:10
move @ jquery.hammer.customswipe.js:123
left @ jquery.hammer.customswipe.js:42
init @ jquery.hammer.customswipe.js:157
$.fn.customSwipe @ jquery.hammer.customswipe.js:173
(anonymous) @ events.js:2
(anonymous) @ events.js:10

标签: javascriptphphtmllibraries

解决方案


显示您提到的错误会很有用。但是,话虽如此,我会转而使用wp_enqueue_script WordPress Enqueue Script。加载文件而不是直接将它们添加到 header.php 文件中。

您可能还必须移动这些文件以加载到页脚而不是页眉中。一个例子是。

wp_enqueue_script( 'hammerJS', get_template_directory_uri() . '/scripts/core/js/libraries/jquery.hammer.customswipe.js', ['jquery'], false, true );

这将确保在此脚本之前加载 jquery(['jquery'] 参数)并将脚本放在页脚(最后一个参数)中。

尝试一下,看看你是否能得到任何结果,但显示你遇到的错误将使我们能够提供更多帮助。


推荐阅读