jQuery, Uncaught TypeError

Question

У меня есть некоторый код JavaScript на моей веб-странице, который загружает некоторые div-ы на страницу. Я также хочу добавить обработчики событий onmouseenter и onmouseleave к каждому элементу div. Я использую jquery для добавления этих обработчиков, но я получаю сообщение об ошибке:

"Свойство '$' объекта [объект DOMWindow] не является функцией"

Мой код выглядит следующим образом, он находится в цикле 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' });
});

У кого-нибудь есть идеи, почему я получаю эту ошибку, или даже что означает ошибка?

Answer 1

Попробуйте заменить все вхождения $ на jQuery.

Также селектор $("resultDiv_" + i.toString()) вряд ли вернет какие-либо элементы. Вы, вероятно, имели в виду: $("#resultDiv_" + i.toString())

И, наконец, убедитесь, что этот код выполняется, когда DOM готов, т.е. внутри:

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

Answer 2

Вы уверены, что jQuery правильно загружен? Может ли это быть конфликтом с другой библиотекой javascript?

Answer 3

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

Это решило проблему для меня.

Answer 4

Вы можете попробовать это:

  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');
  });

или, возможно, jQuery.noConflict решит эту проблему.

Answer 5

Как насчет этого?

      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' });
        });

Или убедитесь, что $("resultDiv_" + i.toString()) не null. Используйте Firebug для проверки элемента.