Question

这是我的HTML代码（我认为问题出在哪里）：

<form name="County" method= "post" action="post">
<select id= item.county_name name= item.county_name> 
<option value="item.county_name"> County </option>

</select>
</form>

这是我的javascript：

$.ajax({
url:'http://107.170.75.124/courts/courts.json',
method: 'post'
})
.done (function(data){
   data.forEach(function(item){
    console.log (item.county_name);
     $ ('select'). append ('<option value="' + item.county_name + '">' + 
'</option>');


})
});

当我尝试运行它时，下拉框显示它们应该是县的所有100个区域，但它们是空白的。所以我的猜测是，HTML存在问题，导致HTML无法显示。所有的县都出现在我的控制台中

Answer 1

您忘记提供<option>元素的实际显示值。你的<option>元素就像这样清盘：

<option value='ajax result item here'></option>

<option>元素为空。

将行更改为：

 $ ('select').append('<option value="' + 
     item.county_name + '">' + item.county_name + '</option>');

或者，就是这样（因为当option没有明确设置任何值时，该值将成为option的显示文本：

 $ ('select').append('<option>' + item.county_name + '</option>');

Answer 2

"value"参数只设置选项的值，但不是它的标签。标签必须介于<option>标签

之间

您的代码不完整。

$ ('select').append('<option value="' + item.county_name + '">' + '</option>');

会产生类似这样的结果

<option value="somecountry"></option>

你需要改变它：

$ ('select').append ('<option value="' + item.county_name + '">' + item.county_name + '</option>');

应该输出

<option value="somecountry">somecountry</option>

如何使用jquery＆amp; amp;自动填充html中的选择框？阿贾克斯

2 个答案: