2017-06-25 262 views
-1

我在我的wordpress themes/themename/js文件中添加了jquery,并尝试使用它,但它不起作用。它应该使我的标题标题红色,但它不。我究竟做错了什么?jquery in wordpress not working

我也得到了以下错误:未捕获的类型错误:(中间值)(...)不是一个函数

的functions.php

function twentyfourteen_child_scripts() { 
    wp_enqueue_script('extra js', get_stylesheet_directory_uri() . '/js/extra.js'); 
} 

add_action('wp_enqueue_scripts', 'twentyfourteen_child_scripts'); 


wp_enqueue_script('jquery', get_template_directory_uri() . '/js/jquery-3.2.0.min.js'); 

EXTRA.JS

window.onload = function() { 
    if (window.jQuery) { 
     // jQuery is loaded 
     alert("Yeah!"); 
    } else { 
     // jQuery is not loaded 
     alert("Doesn't Work"); 
    } 
} 


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

    jQuery('.head-title').css('color','red'); 

}); 

INDEX.PHP

<?php 

get_header(); 

?> 

<div class="container"> 

<div class="secondary-column"> 
    <?php dynamic_sidebar('sidebar1');// sinu widgets sidebar ?> 
</div> 

<div class="post-content"> 

<?php 

if (have_posts()) : 
    while (have_posts()) : the_post(); 

    get_template_part('content', get_post_format()); // dynamically include the post format - get_post_format() - lubab sul sinu enda nullist üles ehitatud posti lisada. Näide: content-aside.php 

    endwhile; 

    else : 
     echo '<p>No content found</p>'; 

    endif; 

?> 

    <div class="pagination"> 
     <?php 
      echo paginate_links(); 
     ?> 
    </div> 

<?php 

get_footer(); 

?> 

的header.php

<!DOCTYPE html> 
<html <?php language_attributes(); ?>> 
    <head> 
     <meta charset="<?php bloginfo('charset'); ?>"> 
     <meta name="viewport" content="width=device-width"> 
     <title><?php bloginfo('name'); ?></title> 
     <?php wp_head(); ?> 



    </head> 

<body <?php body_class(); ?> 


     <!-- site-header --> 
     <header class="site-header"> 

      <div class="header-container"> 
       <nav class="site-nav"> 

        <h1 class ="head-title">My website</h1> 

         <!-- hd-search --> 
        <div class="hd-search"> 
         <?php get_search_form(); ?> 
        </div><!-- /hd-search --> 

        <?php 

        $args = array(
         'theme_location' => 'primary' 
        ); 

        ?> 

        <?php wp_nav_menu( $args); ?> 

        <?php 



        $args2 = array(
         'child_of' => get_top_ancestor_id(), 
         'title_li' => '' 
        ); 

        ?> 

        <div class="children-links"> 

         <?php wp_list_pages($args2); ?> 

        </div> 


       </nav> 


      </div> 

     </header><!-- /site-header --> 
+0

只要使用'$(“头标题‘)的CSS(’颜色”,‘红’);'没有任何的功能定义。 – KyleS

+0

仍然不能正常工作 – Pleinair

+0

试试jQuery('。head-title').css('color','red'); –

回答

0

确保jQuery脚本后,您的脚本加载。 您可以使用依赖注入,当你打电话给你的脚本

wp_enqueue_script('extra_js', '//path to your script..', [ 'jquery' ]); 

注意这部分[“jQuery的”] - 这是你可以设置你的依赖的阵列。

0

WordPress不需要包含jQuery。如果由于某些原因需要包含其他版本的jQuery,则必须使用wp_deregister_script('jquery');

jQuery(document).on("ready page:change", function() { 

    jQuery('.head-title').css('color','red'); 

}); 

添加脚本的层次结构也很重要。当您添加其他版本的jQ时,首先取消注册默认版本,然后添加新版本,然后在wp_enqueue_script中进行一些更改。

0

我不认为你可以在WordPress脚本enqueue句柄中使用空格。另外,在你的functions.php文件中,对jQuery的调用既是冗余的也是在函数之外的。所有你需要做它的依赖性阵列,包括jquery如下加载脚本:

function twentyfourteen_child_scripts() { 
    wp_enqueue_script('extra-js', get_stylesheet_directory_uri() . '/js/extra.js', array('jquery'); 
} 
add_action('wp_enqueue_scripts', 'twentyfourteen_child_scripts');