Почему нельзя присвоить значение внутри функции переменной, объявленной снаружи (globaly)?

Question

Я не знаю, почему я не могу присвоить значение, захваченное функцией .hover, переменной, объявленной глобально.

Вот мой код jQuery:

jQuery(function($){

  var receipt;

  $("#cartItems tr.cItem").hover(

        function()
        {
            $(this).addClass("highlight");
            receipt = $(this).next().children().text();
            console.log(receipt);
        },
        function()
        {
            $(this).removeClass("highlight");
        }
    );

    console.log(receipt);

  });

А здесьмой HTML:

<table id="cartItems">
  <tr>
     <td>Lp.</td><td>z:</td><td>na:</td><td>cena netto:</td>
  </tr>
  <tr class="cItem">
      <td>ru</td><td>pl</td><td>16.00</td>
  </tr>
  <tr>
      <td colspan="4">some simple text that should be assigned </td>
  </tr>
 </table>

Первый console.log(receipt) (внутри .hover функция) работает нормально и выводит some simple text.., а второй ничего не выводит.

Пожалуйста, помогите.

Спасибо всем за столь быстрый ответ.Вы все абсолютно правы в отношении функции .hover.Моя вина.Но теперь у меня есть другая связанная проблема.Мне нужно это значение, чтобы передать его плагину "qTip", который называется так:

$("#cartItems tr.cItem").qtip(
{
    content: receipt,
    show: 'mouseover',
    hide: 'mouseout'
 });

Должен ли я каким-то образом объединить эти вызовы?

Answer 1

«второй» вызов console.log фактически является первым (это происходит, когда документ готов), и в этот момент ваш var не определен

Answer 2

Значение будет присвоено receipt только после вызова функций наведения. Вы входите в консоль до того, как #cartItems tr.cItem был обнаружен.

Answer 3

функция hover () выполняется только тогда, когда вы фактически наводите курсор на элемент.так что вы пишете в основном:

var receipt = null;
var documentReady = someFunctionToBeExecutedLater(){ doesnt matter whats in here };
console.log(receipt);

, как вы можете видеть, на самом деле никто не вызывает функцию (documentReady ()), поэтому квитанция останется нулевой.

Answer 4

Секунда console.log до того, как она отображается в коде, происходит до наведения, поэтому переменная не определена. После того, как вы наведите курсор мыши, он правильно записывает текст дочерних элементов следующего tr. Вот jsfiddle, ваш код работает нормально. http://jsfiddle.net/63xKR/

Answer 5

Как уже упоминали другие, где вы в данный момент поместили console.log(receipt), receipt еще не будет инициализирован.

Если вы хотите изменить это значение на что-то более значимое, вы можете:

1. Переместите объявление переменной за пределы функции загрузки
2. Вызовите console.log (получение) в своей собственной функции, которую вы можете прикрепить к событию щелчка или любому другому действию после функция загрузки.

var receipt;

jQuery(function ($) {
    $("#cartItems tr.cItem").hover(

    function () {
        $(this).addClass("highlight");
        receipt = $(this).next().children().text();
        console.log(receipt);
    }, function () {
        $(this).removeClass("highlight");
    });

});

function printConsole() {
    console.log(receipt);
}

Вот демонстрация jsfiddle , демонстрирующая это.

Обратите внимание, что при первом запуске выводится значениеэто undefined, так как при первой загрузке страницы событие hover не сработало, поэтому переменная не была инициализирована.После того, как вы наведите курсор мыши и нажмите на ссылку, теперь у нее есть значение.