通過使用.val（）返回'null'錯誤的表單驗證通過jQuery.post

我正在構建一個登錄表單，它將根據數據庫驗證登錄，然後如果成功將用戶傳遞給安全頁面。通過使用.val（）返回'null'錯誤的表單驗證通過jQuery.post

我已驗證我的SQL是正確的，並基於我借用代碼的示例，我的提交表單也應該正確。實際上，sample code在我的服務器上正常工作，這表明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拋出一個錯誤說「遺漏的類型錯誤：無法調用null的方法'val'。「

我在這裏錯過了一些東西。假設.post在表單提交之前不會被調用（並且在表單提交之前錯誤不會觸發），爲什麼val()會被調用爲空值？表格將填充到那時。

另外，我住在一個PHP4.4.9服務器上。據我的理解，這不是一個JSON調用（因此PHP5），但我會毫不猶豫地承認我在這裏頭痛。 Webdev對我來說是過去的生活，從來不是我的強項。

來源

2012-03-02 mike.thorn

你在'＃username'和'＃password'上調用'val（）'，當$ .post調用被創建時，這些DOM元素是否存在？ – frictionlesspulley 2012-03-02 17:54:05

您試圖在非jQuery對象上調用val()。當您使用jQuery.noConflict模式時，'$'將不確定。嘗試包裝你這樣的jQuery代碼...

見jQuery.noConflict DOC - 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>

來源

2012-03-02 17:56:58

缺少'jQuery（函數（$）'有點殺死了我（自我標記的noob），但是一旦我得到了它，它就像一個夢一樣。非常感謝！ – 2012-03-02 18:52:45

@ mike.thorn沒問題，很高興幫助：） – 2012-03-02 19:35:49

您可以使用此也

<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>

來源

2012-04-27 14:32:46

你應該添加一些元文本 – keyser 2012-10-28 10:27:25

通過使用.val（）返回'null'錯誤的表單驗證通過jQuery.post

回答

相關問題