在WordPress中使jQuery入队

时间:2018-12-31 23:51:07

标签: javascript php jquery wordpress function

我正在尝试通过functions.php使jQuery文件入队,但似乎无法正常工作。

我知道该脚本有效,因为如果将其放在<script>...</script>中的.php文件的底部,则可以正常工作

该文件名为jargon.js

我已经使用以下命令在functions.php中调用了文件:

add_action('wp_enqueue_scripts','asap_scripts');
// Register your assets during `wp_enqueue_scripts` hook inside 
`functions.php`.
function asap_scripts() {
   // Give the path of the script
    wp_register_script('js-jargon', get_stylesheet_directory_uri() . 
'/js/jargon.js',array('jquery')); 
}

我正在使用jQuery,我的JS代码如下:

function toggleAnswer() { 
jQuery(this).next('.jargon-desc').slideToggle();
 } 

 jQuery('.jargon-desc').hide();

 jQuery('.jargon-header').click(toggleAnswer);

任何帮助都会很棒。 我使用相同的方法调用了其他脚本,效果很好。但我似乎对此有问题..?

2 个答案:

答案 0 :(得分:3)

首先-请在问题中包括JS,以及您从控制台或php,日志等获得的错误(not working不是描述..)

任何-

似乎您正在注册脚本句柄,但实际上并没有请求它..

     <?php
    function asap_scripts() {

    wp_register_script('my_amazing_script_handle',  get_stylesheet_directory_uri() . 
'/js/jargon.js', __FILE__), array('jquery'),'1.1', true);

    wp_enqueue_script('my_amazing_script_handle');
    }

    add_action( 'wp_enqueue_scripts', 'asap_scripts' );  
    ?>

如您所见,wp_register_script()只注册您的句柄,然后wp_enqueue_script()是根据注册的句柄实际触发包含的对象。

对于其他可能的原因和作为调试的经验法则(由于OP中缺少信息):

尝试结合以下三个要点进行调试:

  • 指定jQuery而不是$。 (wp中的已知问题)

如果您使用jQuery,则指定jQuery('el')而不是$('el')

  • 将脚本排入页脚(挂钩wp_footer()操作)

就像这样:

 wp_enqueue_script( 'my-script-handler-js', 
                    plugins_url( '/src/my-script.js', dirname( __FILE__ ) ), 
                    array( 'jquery' ), 
                    filemtime( plugin_dir_path( __FILE__ ) . '/src/my-script.js' ), 
    ,'ver', TRUE );
  • jQuery(document).ready(function ($) { ... });射击

答案 1 :(得分:0)

@ObmerkKronen谢谢您的帮助。

我对以下内容进行了简单的更改:

`function ASAP_scripts(){     wp_register_script('js-jargon',get_stylesheet_directory_uri()。'/js/jargon.js',array('jquery'),'1.1',true);     wp_enqueue_script('js-jargon');     }

add_action( 'wp_enqueue_scripts', 'ASAP_scripts' );  `

工作完美。再次感谢