2017-06-25 255 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');