我正在嘗試使用 ajax get 在后端和前端之間進行連接，一切正常，但在前端什么都沒有出現，但是在顯示的控制臺結果中，為什么會這樣，有什么問題？
這是我的 html 檔案：
<body>
<div id="postResultDiv" align="center"></div>
<div class="container">
<h2>Stacked form</h2>
<form id="customerForm">
<div class="form-group">
<label for="serialNumber">serialNumber:</label> <input type="text" class="form-control" id="serialNumber" placeholder="Enter serialNumber" name="serialNumber">
</div>
<div class="form-group">
<label for="firstName">firstName:</label> <input type="text" class="form-control" id="firstName" placeholder="Enter firstName" name="firstName">
</div>
<div class="form-group">
<label for="lastName">lastName :</label> <input type="text" class="form-control" id="lastName" placeholder="Enter lastName" name="lastName">
</div>
<div class="form-group">
<label for="email">email :</label> <input type="text" class="form-control" id="email" placeholder="Enter email" name="lastName">
</div>
<div class="form-group">
<label for="mobileNumber">mobileNumber :</label> <input type="text" class="form-control" id="mobileNumber" placeholder="Enter mobileNumber" name="mobileNumber">
</div>
<div class="form-group form-check">
<label class="form-check-label"> <input
class="form-check-input" type="checkbox" name="remember">
Remember me
</label>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
<br />
<div class="col-sm-7" style="margin: 20px 0px 20px 0px">
<button id="getALlCustomers" type="button" class="btn btn-primary">Get
All Customers</button>
<div id="getResultDiv" style="padding: 20px 10px 20px 50px">
<ul class="list-group">
</ul>
</div>
</div>
</div>
</body>
這是我的 js (ajax) 檔案：
GET: $(document).ready(
function() {
// GET REQUEST
$("#getALlCustomers").click(function(event) {
event.preventDefault();
ajaxGet();
});
// DO GET
function ajaxGet() {
$.ajax({
type : "GET",
url : "getCustomers",
success : function(result) {
if (result.status == "success") {
$('#getResultDiv ul').empty();
$.each(result.data,
function(i, getALlCustomers) {
var user = "customer Name "
customer.firstName
", email = " customer.email
"<br>";
$('#getResultDiv .list-group').append(
customer)
});
console.log("Success: ", result);
} else {
$("#getResultDiv").html("<strong>Error</strong>");
console.log("Fail: ", result);
}
},
error : function(e) {
$("#getResultDiv").html("<strong>Error</strong>");
console.log("ERROR: ", e);
}
});
}
})
資料檢索正確但 ui 中沒有資料：
這是我的正面，上面沒有顯示資料：
任何人都知道問題出在哪里？
uj5u.com熱心網友回復：
我認為 $each 函式中的問題是因為您將 item 引數命名為“getALlCustomers”，但您將其用作“customer”，而不是附加“user”變數，而是附加“customer”變數，它已經沒有存在。
用下面的代碼替換 $each 函式。
$.each(result.data, function (i, customer) {
var user =
"customer Name "
customer.firstName
", email = "
customer.email
"<br>";
$("#getResultDiv .list-group").append(user);
});
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/492841.html
標籤：javascript html jQuery 阿贾克斯