TypeError是否爲空？

這是我看到的Firebug中的一個錯誤。TypeError是否爲空？

TypeError: $("#gallery-nav-button") is null 
[Break On This Error] 
$('#gallery-nav-button').addClass('animated fadeOutRightBig');

這裏是我的代碼：

$(function() { 
    $("#close-gallery-nav-button").click(function() { 
    $('#gallery-nav-button').addClass('animated fadeOutRightBig'); 
    }); 
});

HTML

<div id="gallery-nav-button"> 
    <h4 id="close-gallery-nav-button">X</h4> 
    <h3 class="text-center small-text"><a class="inline text-center small-text" href="#gallery-nav-instruct">Click Here for Gallery <br /> Navigation Instructions.</a></h3> 
</div>

CSS

#close-gallery-nav-button{ 
    text-indent:-9999px; 
    width:20px; 
    height:20px; 
    position:absolute; 
    top:-20px; 
    background:url(/images/controls.png) no-repeat 0 0; 
} 
#close-gallery-nav-button{background-position:-50px 0px; right:0;} 
#close-gallery-nav-button:hover{background-position:-50px -25px;}

來源

2012-09-26 L84

聽起來像一個jQuery問題。你使用什麼版本？你確定jQuery被加載？ – alexandernst

@alexandernst - 我使用1.8.2，並是它被加載。 – L84

我有幾個腳本運行此頁上，看樣子一個腳本與另一個衝突。爲了解決我的問題，我添加jQuery.noConflict();

var $j = jQuery.noConflict(); 
$j(function() { 
    $j("#close-gallery-nav-button").click(function() { 
    $j('#gallery-nav-button').addClass('animated fadeOutRightBig'); 
    }); 
});

來源

2012-09-26 23:51:43 L84

你也可以把你的jQuery代碼內'（函數（$）{// ...}）（jQuery的）' – undefined

而是倒過來：'的jQuery（函數（$）{...}）' – Bergi

我也想補充 - 因爲這是重要的錯誤消息＃1谷歌搜索結果「類型錯誤：[X]爲空」 - 這是最常見的原因JavaScript開發人員將得到這個結果是他們試圖爲DOM元素分配一個事件處理程序，但是DOM元素尚未創建。

代碼基本上是從上到下運行。大多數開發人員將他們的JavaScript放在HTML文件的頭部。瀏覽器從服務器接收到HTML，CSS和JavaScript;正在「執行」/呈現網頁;並正在執行JavaScript，但它沒有進一步向下執行HTML文件以「執行」/呈現HTML。

爲了解決這個問題，你需要在JavaScript執行之前引入一個延遲，比如把它放到一個函數中，直到瀏覽器「執行」所有的HTML並且觸發事件「DOM就緒」。「

隨着原材料的JavaScript，請在window.onload：

window.onload=function() { 
    /*your code here* 
    /*var date = document.getElementById("date"); 
    /*alert(date); 
}

使用jQuery，使用文件準備：

$(document).ready(function() { 
    /*your code here* 
    /*var date = document.getElementById("date"); 
    /*alert(date); 
});

這樣一來，你的JavaScript將無法運行，直到瀏覽器還內置了DOM時，HTML元素存在（NOT NULL :-)）和你的JavaScript可以找到它並附加一個事件處理它。

來源

2013-08-27 15:43:11

我同意上面給出的建議，有關onload事件。 https://stackoverflow.com/a/18470043/2115934

一個更簡單的解決方案（雖然不一定更好的一個）是把你的腳本標籤只是文檔的結束標記之前。

<!doctype html> 
<html lang="en"> 
<head> 
<meta charset="UTF-8"> 
<title>Document</title> 
</head> 
<body> 
<h1></h1> 
<p></p> 
<script src="script.js" type="text/javascript"></script> <!-- PUT IT HERE --> 
</body> 
</html>

來源

2013-11-27 18:04:49

TypeError是否爲空？

回答

相關問題