jQuery, Uncaught TypeError

Question

Mam trochę kodu javascript na mojej stronie internetowej, który ładuje niektóre elementy div na stronę. Chcę również dodać onmouseenter i funkcje obsługi zdarzeń onmouseleave do każdego elementu div. Używam jQuery dodać te ładowarki, ale pojawia się błąd:

"Property '$' of object [object DOMWindow] is not a function"

Mój kod wygląda tak, to w pętli for:

var newItem = document.createElement('div'); 
newItem.innerHTML = results[i]; 
newItem.setAttribute("id", "resultDiv_" + i.toString()); 
dropDown.appendChild(newItem); 

//Error on next line... 
$("resultDiv_" + i.toString()).bind("mouseenter", function() { 
    $("resultDiv_" + i.toString()).css({ 'background-color': 'blue' }); 
}); 

Czy ktoś ma jakieś pomysły, dlaczego jestem dostaniesz ten błąd, a nawet, co oznacza błąd?

Answer 1

Czy jesteś pewien, że jQuery jest poprawnie załadowany? Czy może to być konflikt z inną biblioteką JavaScript?

Answer 2

Co z próbowaniem tego?

 var newItem = document.createElement('div'); 
     newItem.innerHTML = results[i]; 
     newItem.setAttribute("id", "resultDiv_" + i.toString()); 
     dropDown.appendChild(newItem); 

     //Error on next line... 
     $("resultDiv_" + i.toString()).mouseenter(function() { 
      $("resultDiv_" + i.toString()).css({ 'background-color': 'blue' }); 
     }); 

lub upewnij się, że nie jest null$("resultDiv_" + i.toString()). Użyj Firebug, aby sprawdzić element.

Answer 3

Spróbuj zastąpić wszystkie wystąpienia $ przez jQuery.

Również selektor $("resultDiv_" + i.toString()) prawdopodobnie nie zwróci żadnych elementów. Prawdopodobnie oznaczało: $("#resultDiv_" + i.toString())

I wreszcie upewnić się, że kod jest wykonywany, gdy DOM jest gotowy czyli wewnątrz:

jQuery(function() { 
    // Put your code here 
}); 

Answer 4

Równie dobrze można spróbować to:

var newItem = jQuery('<div id="' + "resultDiv_" + i.toString() + '">+ results[i] + '</div'); 
    jQuery(dropDown).append(newItem); 
    //Error on next line... 
    newItem.mouseenter(function(){ 
     jQuery(this).css('background-color', 'blue'); 
    }); 

czy może jQuery. noConflict rozwiąże to.

Answer 5

(function ($) { 
    // All your code here 
})(jQuery); 

Naprawiono problem dla mnie.