html頁:
<code><!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
<form action="reg.php" method="post" >
用户名 : <input id="input1" type="text" name="username">
<input type="submit" value="注册">
</form>
<div id="div1"></div>
<script>
var oInput = document.getElementById('input1');
var oDiv = document.getElementById('div1');
oInput.onblur = function(){
var xhr = new XMLHttpRequest();
xhr.open('GET','ajax.php?username='+encodeURIComponent(this.value),true);
xhr.onreadystatechange = function(){
if(xhr.readyState == 4){
if(xhr.status == 200){
var obj = JSON.parse(xhr.responseText);
if(obj.code){
oDiv.innerHTML = obj.message;
}
else{
oDiv.innerHTML = obj.message;
}
}
}
};
xhr.send(null);
};
</script>
</body>
</html></code>登入後複製
登入後複製
php頁：
<code><?php
header('Content-type:text/html;charset=utf-8');
$conn = mysqli_connect('127.0.0.1', 'root', '5221107073', 'linshi');
$name = $_GET['username'];
$sql = "SELECT * FROM shi where name='$name'";
$res = mysqli_query($conn, $sql);
if($res && mysqli_num_rows($res)){
echo "{'code':'0','message':'该名字有人注册'}";
}else{
echo "{'code':'1','message':'ok'}";
}
?></code>登入後複製
登入後複製
就是不能從服務端取得到json數據，報錯如下：
<code>SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data</code>
登入後複製
登入後複製
求解
回覆內容：
html頁:
<code><!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
<form action="reg.php" method="post" >
用户名 : <input id="input1" type="text" name="username">
<input type="submit" value="注册">
</form>
<div id="div1"></div>
<script>
var oInput = document.getElementById('input1');
var oDiv = document.getElementById('div1');
oInput.onblur = function(){
var xhr = new XMLHttpRequest();
xhr.open('GET','ajax.php?username='+encodeURIComponent(this.value),true);
xhr.onreadystatechange = function(){
if(xhr.readyState == 4){
if(xhr.status == 200){
var obj = JSON.parse(xhr.responseText);
if(obj.code){
oDiv.innerHTML = obj.message;
}
else{
oDiv.innerHTML = obj.message;
}
}
}
};
xhr.send(null);
};
</script>
</body>
</html></code>登入後複製
登入後複製
php頁：
<code><?php
header('Content-type:text/html;charset=utf-8');
$conn = mysqli_connect('127.0.0.1', 'root', '5221107073', 'linshi');
$name = $_GET['username'];
$sql = "SELECT * FROM shi where name='$name'";
$res = mysqli_query($conn, $sql);
if($res && mysqli_num_rows($res)){
echo "{'code':'0','message':'该名字有人注册'}";
}else{
echo "{'code':'1','message':'ok'}";
}
?></code>登入後複製
登入後複製
就是不能從服務端取得到json數據，報錯如下：
<code>SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data</code>
登入後複製
登入後複製
求解
header的設定不對，這樣設定輸出的是utf-8格式的html，
使用
<code>header('Content-type: application/json');</code>登入後複製
這樣echo的資料即為json格式，
建議將要輸出的內容存進數組，在要輸出的地方使用
<code>echo json_encode($array);</code>
登入後複製
沒試過，你試試看不要直接這麼寫，換個寫法，定義一個數組，然後json_encode()。
後端回傳的格式不對
<code class="php">echo '{"code":"0","message":"该名字有人注册"}'</code>登入後複製
格式不對，json裡面是雙引號的。
這種
<code>echo '{"code":"0","message":"该名字有人注册"}'</code>登入後複製
我在前台頁面把從服務端取得到的結果輸出`if(xhr.readyState == 4){
<code> if(xhr.status == 200){
console.log(xhr.responseText);
console.log(JSON.parse(xhr.responseText));
}
}`</code>登入後複製
在控制台看到是這樣的（是說xhr.responseText取得有問題嗎？）：![javascript - ajax 取得服務端的json資料出錯了，JSON.parse(xhr.responseText)，，，？]()
