把json asnwer放入html標記

我正在學習ajax，而且我面臨着一個巨大的問題，我無法解決。我發送了一些變量到php中，我在那裏做了各種檢查，並將字符串值返回給ajax。我可以將這些顯示爲textare一個（奇怪的結果即刻消失）和輸入字段。我想要做的就是將這些顯示到div s。任何人都可以解釋我該怎麼做，我會在下面留下一些評論的代碼。謝謝！ P.S這是關於爲用戶顯示註冊表單錯誤，也許我可以使用不同的方法？隨意提出一些建議。再次感謝！把json asnwer放入html標記

php.php

<?php 


//various checking here 
echo json_encode(array(
'email_error' => $email_error, 
'password_error' =>$password)); 
?>

HTML

<html> 
<head> 

<link rel="stylesheet" type="text/css" href="mystyle.css"> 

</head> 
<body> 


<form> 
Your email: 
<input type = "text" id = "email"><br> 
Your password: 
<input type = "password" id = "password1"><br> 
Repeat password: 
<input type = "password" id = "password2"><br> 
<button type = "submit" id = "push_button">PushMe</button> 
</form> 
<div id ="email_errors"> </div> <--I want to put variable $email_errors here --> 
<div id = "password_errors"> </div> <--I want to put variable $password_errors here --> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js" type =       "text/javascript" ></script> 
<script type="text/javascript" src="java_script.js"></script> 
</body> 
</html>

java_script.js

$(document).ready(function() { 

$('#push_button').click(function() { 

$.ajax({ 
url: "php.php", 
type: "POST", 
dataType: "json", 
data: { 
email: $("#email").val(), 
password1: $("#password1").val(), 
password2: $("#password2").val() 
}, 
success: function(data) { 

$("#email_errors").val(data.email_error); // i return these values (i tried html data type either 
$("#password_errors").val(data.password_error); 
} 
}); 

}); 
})

來源

2014-12-04 Evaldas Butkus

什麼是JSON的樣子？ – sbonkosky 2014-12-04 20:26:03

'div'沒有'value'屬性。你想使用'.html（）' - >'$（「＃email_errors」）。html（data.email_error）; $（「＃password_errors」）。html（data.password_error）;' – Sean 2014-12-04 20:29:12

還是沒有，我可以看到我的字符串只有當我改變輸入字段的div。 – 2014-12-04 20:53:25

你只希望字符串變量的div裏面說明了什麼？如果這是你想做的事，你必須使用的，而不是「VAL」「HTML」：如果你的數據回來的JSON赤貧的形式

success: function(data) { 

    $("#email_errors").html(data.email_error); 
    $("#password_errors").html(data.password_error); 
}

，並要顯示整個對象，你可以做是這樣的：

success: function(data) { 

    $("#email_errors").html(JSON.stringify(data)); 
}

ALSO：（我不知道，如果它在PHP中一樣），你$('#push_button').click()可能會產生回傳，從而消除了div的內部HTML。嘗試把return false在你點擊功能月底阻止發生回傳：

$（文件）。就緒（函數（）{

$('#push_button').click(function() { 

    $.ajax({ 
     url: "php.php", 
     type: "POST", 
     dataType: "json", 
     data: { 
      email: $("#email").val(), 
      password1: $("#password1").val(), 
      password2: $("#password2").val() 
     }, 
     success: function (data) { 

      $("#email_errors").html(data.email_error); // i return these values (i tried html data type either 
      $("#password_errors").html(data.password_error); 
     } 
    }); 

    return false; // this should stop the postback 
});

}）

來源

2014-12-04 20:33:58 fictus

我如何指定$（「＃email_errors」）。html將包含來自php文件的'email_error「？順便說一下，我的數組只包含1個元素 – 2014-12-04 20:43:05

我的經驗僅限於.NET Aspx，所以我不知道如何從php後端分配'email_error'，我相信其他人可以幫助你解決這個問題。 – fictus 2014-12-04 20:58:31

把json asnwer放入html標記

回答

相關問題