Проблема с объявлением переменной

#jquery

#jquery ( jquery )

Вопрос:

У меня есть форма, в которой я хочу получить значение в текстовом поле с помощью jQuery. Проблема в том, что если я объявлю переменную следующим образом:

 var bdmm = $("#bdmm").val();
 

в событии document.ready, но вне функции, и ссылайтесь на него в функции, текстовое значение равно null. Однако, если я объявляю его внутри функции, он работает нормально. Почему это так?

JQUERY:

Это НЕ сработает:

 $(document).ready(function() {
        var bdmm = $("#bdmm").val();
        $('#submit').click(function(e){
                alert(bdmm);
                e.preventDefault();
        }); 
    });
 

Это сработает:

 $(document).ready(function() {
            $('#submit').click(function(e){
                alert($("#bdmm").val());
                e.preventDefault();

                              //OR
                            var bdmm = $("#bdmm").val();
                            alert(bdmm);
                e.preventDefault();

            });
        });
 

Ответ №1:

В первом примере он немедленно извлекает значение текстового поля в DOM ready. Если в нем уже есть значение, оно будет работать, но оно не будет повторно запрашивать форму, когда событие щелчка действительно произойдет. Вероятно, это не то, что вы хотите.

Во втором примере значение поля формы извлекается, когда на самом деле происходит событие щелчка, что почти наверняка является тем, что вы намереваетесь.

Комментарии:

1. Спасибо за ответ. Теперь я понимаю. Итак, как мне объявить переменные в DOM ready и вызвать их в функции? Или я вообще должен это сделать?

2. @fuz3d Вам не следует этого делать, если вы заботитесь об их значениях при возникновении события. Для нединамических материалов их не нужно объявлять в DOM ready, хотя это один из способов изолировать имена переменных и гарантировать, что правильное значение будет использоваться в функции ( замыкания JavaScript ).

3. Я понимаю. Спасибо. Очень признателен.

Ответ №2:

Проблема в том, что, вероятно, сразу после того, как DOM готов, ваш $("#bdmm").val() файл пуст, и когда пользователь пытается отправить форму, она уже имеет некоторое значение.

Итак, вне обратного вызова поле пустое, внутри обратного вызова поле уже заполнено.

Кроме того, я предлагаю использовать функцию jQuery .submit() для привязки к отправке формы вместо привязки к событию щелчка элемента формы (если только элемент с идентификатором « submit » не отличается от кнопки отправки формы). Это должно дать вам больше гибкости и должно работать также при отправке формы нажатием кнопки «Ввод».

Ответ №3:

Вы также можете создать глобальную переменную (я предпочитаю преобразовать ее в класс, но на этот раз не буду этого делать, чтобы упростить пример):

 var MyGlobal;

$("myTextBox").change(function(){
  MyGlobal = $(this).val();
});
 

Тогда ваш код должен работать так .. все выглядит так:

    var bdmm;
    $(document).ready(function() {
            $("myTextBox").change(function(){
              bdmm = $(this).val();
            });

            $('#submit').click(function(e){
                    alert(bdmm);
            }); 
        });
 

Значение повторно инициализируется при редактировании текстового поля.

http://api.jquery.com/change/