如果这是对已有文章的重新发布。我查看了许多已经发布的有关此问题的不同问题,但感觉没有任何与我的问题相匹配。如果有请链接一下。
我正在尝试学习 AJAX 并拥有一个接受两个输入的表单:serverName 和 isLive。以及将服务器添加到列表的按钮。我已经制作了一个 json 文件,其中有两个服务器,当我从中获取信息以更新列表时,它会列出服务器的 serverName 和 isLive 。当我转到 POST 信息时,列表更新时我得到的所有信息都是未定义的。
使用控制台日志,我知道信息正在从表单传递到要由 AJAX 发送的对象,并且它似乎触发了成功函数,但是当我查看 Json 中没有添加任何内容时,它显示了字段未定义。
index.php
<!DOCTYPE html>
<html>
<head>
<title>Ajax</title>
</head>
<body>
<h1>Server List</h1>
<ul id="servers">
</ul>
<h4>Add a Server</h4>
<p>Server Name: <input type="text" id="serverName"></p>
<p>Offline or Online: <input type="text" id="isLive"></p>
<button id="add-server">Add!</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="main.js"></script>
</body>
</html>
main.js
$(function() {
var $servers = $('#servers');
var $serverName = $('#serverName');
var $isLive = $('#isLive');
$.ajax({
type : 'GET',
url: 'servers.json',
success: function(servers) {
$.each(servers, function(i, server) {
$servers.append('<li>Server: '+ server.serverName +', Status: '+server.isLive+'<li>');
});
},
error: function() {
alert('Error loading server status!');
}
});
$('#add-server').on('click', function() {
var server = {
serverName: $serverName.val(),
isLive: $isLive.val(),
};
console.log(server);
$.ajax({
type: 'POST',
url: 'servers.json',
data: server,
success: function(newServer) {
$servers.append('<li>Server: '+ newServer.serverName +', Status: '+newServer.isLive+'<li>');
},
error: function(){
alert('error saving server');
}
});
});
});
服务器.json
[{"serverName":"vanilla","isLive":"offline"}, {"serverName":"SkyFactory","isLive":"Online"}]
最佳答案
您无法使用 JavaScript 修改服务器中的文件。检查这可能有帮助: Use JQuery to Modify external JS File
关于javascript - 从 AJAX 读回 POST 时获取未定义,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41730996/