通過ID獲取元素不起作用

Question

Verry的簡單問題：

我有這個HTML：

<div id="test" style="border: 1px solid red; width: 300px;">
    Some text
</div>

並將此JS放在單獨的.js文件中：

$('#test').hover(function(){
    alert('it's working');
});

我沒有收到來自Fire Bug的任何錯誤，並且對此進行了很多搜索。 請幫助：為什么我的代碼不起作用？

提前致謝

Answer 1

您需要等待DOM加載#test ，否則，您的JavaScript將在#test甚至存在之前運行。 您可以通過將代碼包裝在ready函數中來做到這一點，如下所示：

$(document).ready( function() {
    $('#test').hover(function(){
        alert("it's working");
    });
};

這是一個棘手的問題，很容易被忽視，因為通過對空選擇進行操作，您實際上不會從jQuery中得到錯誤。

或者，您可以簡單地將腳本移至頁面底部，以便在其余DOM加載后執行該腳本，但我更喜歡采用這種方式。

Answer 2

您的問題很可能是您的警報消息中的“”，它會產生錯誤。

嘗試將其刪除。

$('#test').hover(function(){
    alert('its working'); 
});

否則，看看這個小提琴： http : //jsfiddle.net/7a4ts46s/

Answer 3

像這樣包裝您的函數：

$(document).ready(function() { 
    $('#test').hover(function(){
        alert('it\'s working');
    });
});

Answer 4

您會在警報消息中看到“-它正在運行”（第二個“無意中關閉了字符串”），您應該更改為

$('#test').hover(function(){
    alert("it's working");
});

Answer 5

確保從html文件鏈接了單獨的.js文件。 如果將其放在底部，它應該可以工作：

<script src="your-file.js"></script>
</body>
</html>

或在本節中鏈接它，然后等待DOM加載，如其他答案所述。 通常，我喜歡將.js文件<script>標記放在底部，然后等待DOM加載。

但是請確保已加載.js文件，如果未從html頁面鏈接到該文件，則它將永遠不會運行。 常規調試技巧：始終確保您實際上正在運行您認為正在運行的文件:)