我正在尝试进行ajax调用以从我的数据库中获取国家/地区列表。以下是代码的一部分:
country.php:
while ($country = $stmt->fetch(PDO::FETCH_ASSOC)) {
$data[] = $country['country'];
}
echo json_encode(array("response"=>$data));
}
我得到以下回复:
{"response":["Afghanistan","Albania","Algeria","American-Samoa","Andorra","Angola"......
Ajax代码:
//country select
$( "#country" ).focus(function() {
$.ajax({
url: 'country.php',
dataType: 'json',
contentType: 'application/json',
success: function(data) {
//console.log(data);
var formoption = "";
$.each(data, function(v)
{
var val = data[v];
formoption += "<option value='"+val+"'>"+val+"</option>";
});
$('#countries').append(formoption);
}
});
});
,格式为:
<select id="country" name="country" class="form_input required">
<div id="countries"></div>
</select>
某种程度上它不起作用,我无法找到原因。请注意我是一个JavaScript新手。我将它用作Framework7代码的一部分。
期待专家的帮助。
答案 0 :(得分:3)
使用$('#countries').append(formoption);
并删除select tag&amp;中的div标签将选择ID更改为国家/地区,请使用以下html
<select id="countries" name="countries" class="form_input required">
</select>
您在div
标记中包装了选项,因此不适合html。
选项应直接附加到选择标记。
参考下面的示例代码
$(function() {
var resultFromAjax = {response: ["Afghanistan", "Albania", "Algeria", "American-Samoa", "Andorra", "Angola"]}
var data = resultFromAjax.response
var formoption = "";
$.each(data, function(v) {
var val = data[v]
formoption += "<option value='" + val + "'>" + val + "</option>";
});
$('#countries').html(formoption);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="countries" name="country" class="form_input required">
</select>
答案 1 :(得分:1)
数据只有一个名为response的项目,其中包含一个json对象。
当你在php中使用json_encode时,需要json.parse响应。
在$ .each ...之前添加...
data = JSON.parse(data);
然后在你的&#34;每个&#34;中使用... data.response
环
$( "#country" ).focus(function() {
$.ajax({
url: 'country.php',
dataType: 'json',
contentType: 'application/json',
success: function(data) {
data = JSON.parse(data);
$.each(data.response, function(key, value) {
$('#country')
.append($("<option></option>")
.attr("value",key)
.text(value));
});
}
});
});
或类似的......
答案 2 :(得分:0)
你可以这样写:
//country select
$( "#country" ).focus(function() {
$.ajax({
url: 'country.php',
dataType: 'json',
contentType: 'application/json',
success: function(data) {
//console.log(data);
var formoption = "";
obj = JSON.parse(data['response']);
for (i in obj) {
formoption += "<option value='"+obj[i]+"'>"+obj[i]+"</option>";
}
$('#countries').append(formoption);
}
});
});
答案 3 :(得分:0)
你可以试试这个。
$( "#country" ).focus(function() {
$.ajax({
url: 'country.php',
dataType: 'json',
contentType: 'application/json',
success: function(data) {
var formoption = "";
$.each(data.response, function(k, v) {
formoption += "<option value='"+v+"'>"+v+"</option>";
});
$('#countries').append(formoption);
}
});
});