Wordpress 主题：JavaScript 不工作答案

【问题标题】：Wordpress Theme: JavaScript not workingWordpress 主题：JavaScript 不工作
【发布时间】：2014-07-08 18:07:00
【问题描述】：

我正在尝试设计我自己的wordpress 主题，但我在让我的JavaScript 工作时遇到了问题，而且我的研究似乎都没有答案。如果有人可以帮助我，我将不胜感激！

我做过的事情：

在functions.php中加入我的javascript文件：

function sorenTheme_scripts() {
    wp_enqueue_style('style', get_stylesheet_uri());
    wp_register_script( 'soren-script', get_template_directory_uri() . '/js/soren-script.js', array( 'jquery', 'jquery-ui-core' ), '1', true );
    wp_enqueue_script('soren-script');
}
add_action('wp_enqueue_scripts', 'sorenTheme_scripts');

在目录 {template folder}/js 中创建一个名为 soren-script.js 的简单 JavaScript 文件，目前只包含一个非常简单的警报测试

alert('Hello World');

就是这样。当我尝试使用script tags 直接将警报放在index.php file 中时，警报按预期出现，但是当我将它移动到 js 文件时，我什么也没得到。我需要添加到.php 或.js 文件中吗？

编辑：当我查看开发者控制台时，源文件包括 jquery、我的 css 文件等，但不包括 soren-script.js

所以我想让 soren-script.js 出现会解决问题，但我不知道该怎么做，我认为 enqueue 会使其自动显示为源，就像我的风格一样表

【问题讨论】：

您的浏览器控制台输出是什么样的？
浏览器控制台没有任何与警报相关的信息，只有消息“考虑使用 'dppx' 单位而不是 'dpi'，如 CSS 'dpi' 表示每 CSS 点数-英寸，而不是每物理英寸的点数，因此不对应于屏幕的实际“dpi”。在媒体查询表达式中：(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) "
你的 index.php 文件中有 'wp_footer()' 挂钩吗？
是的，在我的 php 开头我有最后我有
看我的回答。 get_footer =/= wp_footer

标签： javascript php html wordpress wordpress-theming

【解决方案1】：

尝试像这样包含您的脚本：

wp_enqueue_script('scriptname', get_template_directory_uri() . '/js/scriptname.js', array(), '20140520', true);

第二件事。您是否将警报放在 document.ready 或其他内容中？

【讨论】：

我尝试使用如图所示的一行队列添加我的脚本，但没有结果。另外，不，我没有使用 document.ready，只是我帖子中显示的一行。我需要一个文件。准备好了吗？
没有。你不需要文件。准备好了。有时它很有用，但你不需要它。你有另一个同名的脚本吗？这是我做过几次的失败。然后脚本不会被加载。
您的脚本是包含但未执行还是根本不包含？
我刚刚添加了一个编辑来解释这一点。它似乎没有包含在内，因为我在开发者控制台中找不到它作为源文件
正如其他人所写，检查您的footer.php 是否包含“wp_footer();”

【解决方案2】：

您的模板中可能没有 wp_footer() 函数。因为在这个钩子中代码会被加载，如果你没有定义钩子，它就不会出现。

$in_footer （布尔值）（可选）通常，脚本放置在 HTML 文档中。如果此参数为 true，则脚本放置在结束标记之前。这要求主题在适当的位置有 wp_footer() 模板标签。默认值：假

参考：http://codex.wordpress.org/Function_Reference/wp_enqueue_script

注意get_footer() 和wp_footer() 是2 different things：

get_footer() 模板标签是 locate_template() 函数的自定义包装，用于在模板文件中包含模板部分文件。 get_footer() 模板标签是 WordPress 模板系统的一部分，主要由主题本身使用，以指定要包含在当前模板中的 footer.php 或 footer-{slug}.php 文件。

wp_footer() 模板标签是 wp_footer 动作钩子的自定义包装器，通过 do_action('wp_footer') 调用。 wp_footer() 模板标签是 WordPress Hooks API 的一部分，主要由插件使用，在站点 HTML 页脚中注入脚本。

wp_footer 钩子通常放置在结束正文标记之前：

<?php
    wp_footer();
?>
</body>

cfr.：http://codex.wordpress.org/Function_Reference/wp_footer

【讨论】：

所以 $in_footer 是我的 wp_enqueue_script 函数调用中的一个参数，但我将其设置为 false。我认为这意味着我不需要担心 wp_footer？或者即使它是假的，我仍然需要它吗？
在您的示例中，它设置为 true。而且你应该总是包含 wp_footer() 因为很多插件也使用这个钩子来插入脚本等。不包括这个会破坏很多插件
仅供参考，这是最后一个真实的： wp_register_script( 'soren-script', get_template_directory_uri() . '/js/soren-script.js', array( 'jquery', 'jquery-ui-core '), '1', 真);
哦哇哇哈哈我以为我把它设置为假 X）所有脚本现在正在加载！非常感谢！！！

【解决方案3】：

在你的functions.php中添加以下内容；

add_action('wp_enqueue_scripts', function () {
    wp_enqueue_script(
       'script name', 
       get_template_directory_uri() . '/functions/js/script.js', 
       array('jquery') // any script dependancies. i.e. jquery
    );
});

在您的文件管理器中，将您的脚本放在 functions/js/ 文件夹中。

确保以下内容打开和关闭您的脚本。

jQuery(document).ready(function($) {
}

这对我来说是一种享受，应该是让 js 在 wordpress 主题上正常工作所需要的全部内容

【讨论】：