Question

有没有一种方法可以将Javascript直接添加到页面中，但是让Wordpress等待jQuery加载？就像使用wp_enqueue_script一样？

在自定义页面模板中，我有以下代码：

<?php if (isset($_GET['status']) && $_GET['status'] == 'newly_created') : ?>
    <script>
        $(function() {
            App.dialogs.afterPetitionCreate();
        });
    </script>
<?php endif; ?>

WordPress吠叫$未定义。现在，我不想仅加载整个.js文件来调用该函数。因此，从这个意义上讲，wp_enqueue_script是不可行的。我只想直接在页面上触发一些JavaScript，但我确实想等待jQuery加载。

这也是我尝试过的方法，使用Wordpress将JavaScript添加到页脚中：

<?php if (isset($_GET['status']) && $_GET['status'] == 'newly_created') :
    add_action('wp_footer', 'my_footer_scripts');
    function my_footer_scripts() { ?>
        <script>
            $(function () {
                App.dialogs.afterPetitionCreate();
            });
        </script>
    <?php } ?>
<?php endif; ?>

但不幸的是，出现了相同的错误$ is undefined。那么在自定义的Wordpress页面模板上快速加载一些Javascript并等待jQuery加载的正确方法是什么？

Answer 1

我认为这不是一个好习惯。

最好将逻辑更改为以下形式：

<?php if (isset($_GET['status']) && $_GET['status'] == 'newly_created') : ?>
    <input type='hidden' id='status' name='status' value='newly_created'>
<?php endif; ?>

script.js：

$(function() {
    if ( $('#status').val() === 'newly_created' ) {
        App.dialogs.afterPetitionCreate()
    }
});

和

wp_enqueue_script( 'afterPetitionCreate', '/path/to/script.js', array( 'jquery' ), '', true );

p.s。您可以将wp_enqueue_script()包装到is_page_template( 'my-cool-page-teplate.php' )中。

Answer 2

您是否尝试过在文档就绪事件中运行脚本，例如以下代码？

<script>
jQuery(document).ready(function($){
   $(function () {
      App.dialogs.afterPetitionCreate();
   });
});
</script>

.ready事件在加载文档或DOM的对象时发生，这使得放置所有jquery事件和其他功能非常理想。

Answer 3

这是我最终编写的代码，并且完全满足我的要求。就像提到的Submit Parkash一样，需要使用jQuery代替$。

/*
 * Adds a single bit of Javascript to the page.
 */
function theme_embed_script($script) {
    add_action('wp_footer', function ($script) {
        echo '<script type="text/javascript">' . $script . '</script>';
    }, 10);
    do_action('wp_footer', $script);
}

用法：

<?php theme_embed_script('jQuery(function () { alert("Hello"); });'); ?>

或者使用像David提到的那样使用Wordpress的wp_add_inline_script()脚本。

有没有一种方法可以使用wp_enqueue_script直接添加JavaScript？

3 个答案: