gpt4 book ai didi

javascript - 使用 jQuery 从 JSON 访问数据

转载 作者:行者123 更新时间:2023-11-28 19:32:49 25 4
gpt4 key购买 nike

需要代码方面的帮助来提供此 JSON 响应的迭代:

JSON 响应:

[{"id":"1","FK_country":"USA","FK_state":"Arizona","FK_city":"Phoenix","zip":"85001","update_by":"SYSTEM","update_when":"0000-00-00 00:00:00"},
{"id":"2","FK_country":"USA","FK_state":"Arizona","FK_city":"Phoenix","zip":"85002","update_by":"SYSTEM","update_when":"0000-00-00 00:00:00"},
{"id":"3","FK_country":"USA","FK_state":"Arizona","FK_city":"Phoenix","zip":"85003","update_by":"SYSTEM","update_when":"0000-00-00 00:00:00"}]

我在以下建议的帮助下更新的代码是

function test3 () 
{

var myCriteria = "";

var key = "mykey";

myCriteria = $( "#city" ).val();

$('#myTestDiv').empty().append(myCriteria);

var myDataRequest = $.ajax({
url: 'ajx_zip.php',
type: 'POST',
dataType: 'json',
data: {city:myCriteria, api_key:key},
success: function(myData)
{
alert( "Data Request Success!" );

$('#zip')
.find('option')
.remove()
.end();

$( "#myTestDiv" ).append( "<p>" + myData + "</p>" );

var myNewData = $.parseJSON(myData);

$( "#myTestDiv" ).append( "<p>" + myNewData + "</p>" );

$.each(myNewData, function(i, value)
{
$('#zip').append($('<option></option>').val(value.FK_city).html(value.FK_city));
});
}

});

myDataRequest.fail(function(jqXHR, textStatus)
{
if (jqXHR.status === 0)
{
alert('Not connect.n Verify Network.');
}
else if (jqXHR.status == 404)
{
alert('Requested page not found. [404]');
}
else if (jqXHR.status == 500)
{
alert('Internal Server Error [500].');
}
else if (exception === 'parsererror')
{
alert('Requested JSON parse failed.');
}
else if (exception === 'timeout')
{
alert('Time out error.');
}
else if (exception === 'abort')
{
alert('Ajax request aborted.');
}
else
{
alert('Uncaught Error.n' + jqXHR.responseText);
}
});

}

我根据建议更新的 HTML 代码是:

<!doctype html public "-//w3c//dtd html 3.2//en">
<html>
<head>
<title>Test</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script language="javascript" src="select.js"></script>
</head>

<body>

<h3>Test Address for Javascript</h3>

<FORM name="address" action="testresult.php" method="POST" >

<SELECT ID="country" NAME="country" >
<Option value="">Select Country</option>
<Option value="USA">United States</option>
<Option value="CAN">Canada</option>
</SELECT>

<br><br>

<SELECT id="state" NAME="state">
<Option value="Arizona">Arizona</option>
<Option value="California">California</option>
</SELECT>

<br><br>

<SELECT id="city" NAME="city" onchange="test3();">
<Option value="Phoenix">Phoenix</option>
<Option value="Glendale">Glendale</option>
<Option value="Chandler">Chandler</option>
<Option value="California">California</option>
</SELECT>

<br><br>

<SELECT id="zip" NAME="zip">
<Option value="Select Zip">Select Zip</option>
</SELECT>

</form>

<div id="myTestDiv"></div>
</body>

</html>

此外,我创建了一个从同一服务器到 PHP 处理页面的简单 html 形式的 POST 测试,现在我生成了一个有限的数据集,加速了为测试 API 而创建的客户端性能 - 所有这些都可以很好地产生预期结果如本文顶部所示(“结果”页面的回声)。但是,现在在 $.parseJSON 级别的 Javascript 函数内处理 JSON 对象时会发生错误。在测试输出 DIV 中,我附加的输出如下...

Chandler
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

最佳答案

替换这个:

<SELECT id="city" NAME="city" onselect="AddZipOptions();">

这样:

<SELECT id="city" NAME="city" onchange="AddZipOptions();">

onSelect 是当您用鼠标选择某些文本时触发的事件!

您还应该在附加结果之前清理 zip 选择:

$("#zip").children(':not(:first)').remove()
$("#zip").append($('<option>', {text: result.zip, value: result.zip}));

关于javascript - 使用 jQuery 从 JSON 访问数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26444640/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com