web-dev-qa-db-ja.com

キューに入れずに依存関係を持つスクリプトを実行するための正しいメソッド

エンキューを使用すると、$depsを自分のスクリプト、またはスクリプトを機能させるために最初に実行するために必要なスクリプトの配列に変更できます。

<?php wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer ); ?>

例えば：

function script_that_requires_jquery() {
    wp_register_script( 'script-with-dependency', 'http://www.example.com/script-with-dependency.js', array( 'jquery' ), '1.0.0', true );
    wp_enqueue_script( 'script-with-dependency' );
}
add_action( 'wp_enqueue_scripts', 'script_that_requires_jquery' );

私は通常これを行いますが、いつもうまくいくとは限りません。

function script_that_requires_jquery(){
    if ( wp_script_is( 'jquery', 'done' ) ) { ?>
        <script type="text/javascript">
        (function($) {
            // jquery function goes here    
        })( jQuery );
        </script>
    <?php }
}
add_action('wp_footer', 'script_that_requires_jquery');

たぶんこれはそれ？

function script_that_requires_jquery(){
    wp_enqueue_script( 'jquery' );
    ?>
        <script type="text/javascript">
        (function($) {
            // jquery function goes here    
        })( jQuery );
        </script>
    <?php 
}
add_action('wp_footer', 'script_that_requires_jquery');
jquerywp-enqueue-scriptscriptswp-register-script
5
Bryan Willis
function script_that_requires_jquery() {
    wp_register_script( 'script-with-dependency', 'http://www.example.com/script-with-dependency.js', array( 'jquery' ), '1.0.0', true );
    wp_enqueue_script( 'script-with-dependency' );
}
add_action( 'wp_enqueue_scripts', 'script_that_requires_jquery' );

これは、スクリプト（およびそのスタイル）をキューに登録する正しい方法です。 alwaysを使用して、スクリプトとスタイルをフックするために wp_enqueue_scripts を使用する必要があります。

ここには、スクリプトとスタイルを登録するときに確認することがいくつかあります。まず、関数内でそれらを配置する順序が正しいことを確認します。関数の最初のスクリプトが最初に実行され、2番目のスクリプトが最初に実行されます。したがって、jqueryに依存するスクリプトをjqueryの前に配置することはできません。

他の潜在的な落とし穴は add_action( $hook, $function_to_add, $priority, $accepted_args ); です。 $priorityパラメーターを設定しないと、スクリプト/スタイルが他のスクリプト/スタイルを上書きする前にロードされる危険が常にあります。

あなたの場合、スクリプトはjqueryの前にロードされる可能性があるため、動作しません。 Ialwaysカスタムスクリプトとスタイルを追加するときに、このパラメーターに非常に低い優先度（非常に高い数値）を設定します。これにより、スクリプトとスタイルが最後に完全に読み込まれます。だから私はこのようなことをします

add_action( 'wp_enqueue_scripts', 'script_that_requires_jquery', 999 );
4
Pieter Goosen

Jqueryに依存するコードの前にjquery（または他のライブラリ）をエンキューするだけでは十分ではありませんが、コードがブラウザによって解析または実行される前にjqueryがロードされていることも確認する必要があります。

0
Mark Kaplun