表單不能使用jquery post功能

我想做一個簡單的用戶驗證，但是，當我嘗試使用html表單的post請求函數時，瀏覽器忽略jquery post請求，而是發送get請求。一套新的眼睛會有很大的幫助！表單不能使用jquery post功能

這裏的腳本：

$(document).ready(function() { 
    var user = $("#username"); 
    var pass = $("#password"); 
    var submit = $("#submit"); 

    $("#submit").click(function (event) { 
     event.preventDefault(); 
     $.post("login.php", { 
      username: user.val(), 
      password: pass.val() 
     }, function (data) { 

      if (!data) { 
       $("#login").append("Failed to reach server. Login Error."); 
      } 
      //$("div#login").hide(); 
      //$("div#welcome").css("display", "block"); else { 
       loadpage(); 
      } 

     }, "json"); 

     return false; 
    }); 
});

下面是HTML的形式，這是很簡單的：

<Div id="welcome"> Welcome </div> 
<Div id="login"> 
    <br><br><h2>Welcome to This Site</h2> 
    <br><br><br><form id="form"> Username: 
    <input type = "text" name = "username"> <br> Password: 
    <input type = "password" name = "password" id = "password"> <br> 
    <input type = "submit" name="submitbutton" id="submitbutton" class = "bluebutton"> 


</Div>

只是爲了消除任何可能的地方失敗的緣故，我對硬編碼的用戶名/密碼這裏的PHP：

<? 
if($username == "harry" && $password == "potter") 
{ 
    $_SESSION["user"] = array(); 
    $array = array(); 
    $array["valid"] = "valid"; 
    echo(json_encode($array)); 
} 

?>

在此先感謝！

來源

2012-08-17 kinson

您的表單沒有像</form>這樣的結束標記，而且我也沒有在您的表單中找到任何與標識爲submit的元素，因此它可能不會觸發用下面的代碼

$("#submit").click(function(event){...});

的功能，而不是它應該是

$("#submitbutton").click(function(event){...});

而且return false;是不必要的，因爲你已經使用event.preventDefault();。

您的表單應該有一個結束標記。即

<form id="myForm"> 
    <input type = "text" name = "username"> <br> Password: 
    <input type = "password" name = "password" id = "password"> <br> 
    <input type = "submit" name="submitbutton" id="submitbutton" class = "bluebutton"> 
</form>

或者您可以使用

$('#myForm').on('submit', function(e){ 
    e.preventDefault(); 
    // Rest of your code 
})

來源

2012-08-17 07:50:24

太謝謝你了！我完全分開標籤，由於某種原因，認爲只要提交就可以完成這項工作！ :) – kinson 2012-08-17 15:38:56

不客氣:-) – 2012-08-17 18:35:52

我看到的問題是，在jQuery的你有

$("#submit").click(function(event){

和HTML你有

<input type = "submit" name="submitbutton" id="submitbutton" class = "bluebutton">

，如果你把ID在你輸入=「提交」，那麼它應該工作：）

來源

2012-08-17 07:49:07 rain01

表單不能使用jquery post功能

回答

相關問題