爲什麼我會得到一個的ReferenceError：未定義

我試圖jQuery的添加到我的網頁，我雖然收到此錯誤：的ReferenceError：預覽沒有定義爲什麼我會得到一個的ReferenceError：未定義

我在的JS目錄下的js文件我主題：

jQuery(document).ready(function() { 
    function preview() { 
     var hoverhome = 'url("images/Screen2.png") no-repeat'; 
     var empty = ''; 
     //home 
     $('nav .home a').hover(function() { 
      $('.viewport').css('background-image', hoverhome); 
     }); 
     $('nav .home a').onmouseout(function() { 
      $('.viewport').css('background-image', empty); 
     }); 
    } 
});

我有這個在我的函數文件：

function add_my_script() { 
    wp_enqueue_script(
     'preview', 
     get_template_directory_uri() . '/js/scriptfile.js', 
     array('jquery') 
    ); 
}

這是我的HTML head標籤：

<head> 
    <meta charset="<?php bloginfo('charset'); ?>" /> 
    <title><?php wp_title('|','true','right'); ?><?php bloginfo('name'); ?></title> 
    <meta name="viewport" content="width=device-width" /> 
    <link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url'); ?>" /> 
    <script type='text/javascript' src='<?php bloginfo('template_url'); ?>/scriptfile.js?  ver=1.7.1'></script> 
    <?php wp_head(); ?> 
</head>

，這是在我的頭調用函數：

<div class="viewport"> 
    <script type="text/javascript"><!--//--><![CDATA[//><!-- 
     preview(); 
    //--><!]]></script> 
</div>

最後，這是我的CSS：

.viewport 
{ 
height: 400px; 
width: 400px; 
position: relative; 
top: -90px; 
margin: 0 auto; 
}

不過。我在螢火蟲中得到這個錯誤：

ReferenceError: preview is not defined

來源

2013-05-31 Chris

預覽（）創建函數文檔準備就緒後，您不能在

您已經定義preview一個函數內。這範圍它的功能，所以它不是一個全球性的，你不能從除了該函數內的任何地方調用它。

擺脫

jQuery(document).ready(function() { 
});

包裝的。它沒有做任何有用的事情，它正在破壞你的代碼。

您還需要確保您使用與調用它或更早的腳本相同的腳本來定義preview。（或者你需要延遲執行，如下所述）。

請注意，如果您在涉及的元素存在之前調用preview，那麼它不會執行任何操作。所以你還需要確保當你打電話時，你在他們存在之後這樣做。直接撥打電話標頭可能不會那樣做。將調用移動到頁腳或將其包裝在一個document.ready事件處理程序中（正如您當前爲函數聲明所做的那樣）。

來源

2013-05-31 08:01:38 Quentin

我已經刪除了這個包裝，但錯誤依然存在。 – Chris

你不應該添加

<script type='text/javascript' src='<?php bloginfo('template_url'); ?>/scriptfile.js?  ver=1.7.1'></script>

您<head>。

你應該勾你的函數add_my_script像這樣的（你可以只是你add_my_script功能後添加以下代碼片段）：

add_action('wp_enqueue_scripts', 'add_my_script');

它鉤住wp_enqueue_scripts後，當它在調用wp_head(); WordPress會自動添加腳本你的頭文件。

爲了避免範圍界定錯誤，rmove的document ready包裝：

function preview() { 
     //the rest of your code here 
    }

調用DOM後的功能已準備就緒：您的代碼應該是這樣的：

<div class="viewport"> 
    <script type="text/javascript"><!--//--><![CDATA[//><!-- 
    jQuery(document).ready(function($){ 
     preview(); 
    }); 
    //--><!]]></script> 
</div>

來源

2013-05-31 08:55:08 RRikesh

我已經添加了你的代碼，但積累了更多的錯誤。 TypeError：$不是函數，原始錯誤ReferenceError：預覽未定義 – Chris

嘗試用'jQuery'代替預覽函數中的'$' – RRikesh

您確定該文件正在被包含嗎？ – RRikesh

相關問題