Проверка формы через jQuery.post с .val (), возвращающим ошибку 'null'

Question

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

Я проверил, что мой SQL правильный, и на основании примеров, из которых я позаимствовал код, моя форма отправки также должна быть правильной.Фактически, пример кода работает на моем сервере правильно, что говорит об ошибке DOM.Это урезанная версия того, что я запускаю:

<script type="text/javascript" src="inc/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function() {
    jQuery("#login_form").submit(function() {
        jQuery("#msgbox").removeClass()
                         .addClass('messagebox')
                         .text('verifying')
                         .fadeIn(1000);

        jQuery.post("inc/ajax_login.php", {
            user_name: $('#username').val(),
            password: $('#password').val()
        }, function(data) {
            if (data == 'yes') { /* ... */
            }
            else { /* ... */
            }
        });
        return false;
    });
});​
</script>

Форма работает таким образом, на несколько строк дальше вниз по странице:

<form action="" id="login_form" method="POST">
  <input type="text"     name="username" id="username" value="username" />
  <input type="password" name="password" id="password" value="password" /><br />
  <input type="hidden"   name="homeDir"  id="homeDir"  value=""         /> <span id="msgbox"></span> <br />
  <input type="submit"   name="Submit"    id="submit"    value="ENTER" class="submit"/>
</form>

Однако JS выдает ошибкуговоря "Uncaught TypeError: Невозможно вызвать метод 'val' с нулевым значением."

Я что-то здесь упускаю.Учитывая, что .post не вызывается до тех пор, пока форма не отправлена ​​(и ошибка не сработает до тех пор, пока форма не будет отправлена), почему бы val() вызываться с нулевым значением?Форма будет заполнена к тому времени.

Кроме того, я живу на сервере PHP4.4.9.Насколько я понимаю, это не вызов JSON (следовательно, PHP5), но я могу свободно признать, что я над головой здесь.Вебдев был прошлой жизнью для меня и никогда не был моей сильной стороной.

Answer 1

Вы пытались вызвать val() для объекта, не являющегося jquery. При использовании jQuery.noConflict режим '$' будет неопределенным. Попробуйте обернуть свой код jquery следующим образом ...

См. Документ jQuery.noConflict - http://api.jquery.com/jQuery.noConflict/
Различные методы использования jQuery.noConflict - http://zenverse.net/jquery-how-to-fix-the-is-not-a-function-error-using-noconflict/

<script>

jQuery.noConflict();

(function($) { 
    $("#login_form").submit(function()
    {
        $("#msgbox").removeClass().addClass('messagebox').text('verifying').fadeIn(1000);

        $.post("inc/ajax_login.php", {
            user_name: $('#username').val(),
            password: $('#password').val()
        }, function(data) {
          if(data=='yes') {/* ... */}
          else {/* ... */}
        });

        return false;
    });
})(jQuery);

</script>

Answer 2

Вы можете использовать это также

<script>

jQuery.noConflict();


jQuery("#login_form").submit(function()
{
    jQuery("#msgbox").removeClass().addClass('messagebox').text('verifying').fadeIn(1000);

    jQuery.post("inc/ajax_login.php", {
        user_name: jQuery('#username').val(),
        password: jQuery('#password').val()
    }, function(data) {
      if(data=='yes') {/* ... */}
      else {/* ... */}
    });

    return false;
});

</script>