前台处理json数据绑定到select
前台怎样对这个数据处理绑定到select下拉列表 展开
【1】你的JSON数据格式不正确。
应该去掉标红的问好 {"d":"["安丘,3487","博山,939","苍山,1873","莘县,3554"]"}
【2】在HTML页面中,给目标Select定义一个ID,例如:
<div>
<select id="sample_select">
</select>
</div>
【3】使用Javascript填充SELECT
首先将你接收到的responseText(存储在变量strData里面)反序列化:
var jData = JSON.parse(strData);
然后准备一个集合了所有OPTION的字符串:
var strOptions = "";
for(var i=0; i<jData.d.length; i++){
strOptions = strOptions + '<OPTION value=">' + jData.d[i] + '“>' + jData.d[i] + '</OPTION>';
}
把这个HTML字符串,赋值给SELECT:
document.getElementById("sample_select").innerHTML = strOpitons;
当然啦,你也可以使用removeChild和appendChild方法来直接操作SELECT元素:
首先循环调用removeChild方法,清空SELECT的所有选项;
然后根据jData的数据,依次appendChild。
这种方法似乎更学术、更文雅一些……
(以上代码没有实测,可能有拼写错误或者小bug,请自行处理。)