js关于从数据库取数据动态给下拉框默认选择项赋值问题

json数据如下：
{
    "code": 200, 
    "msg": "执行成功！", 
    "data": {    
        "list_supply": [
            { 
                "supply_id": "1", 
                "supply_name": "肉类供应商"
            }, 
            { 
                "supply_id": "2", 
                "supply_name": "果蔬供应商"
            }, 
            { 
                "supply_id": "12", 
                "supply_name": "优良食品有限公司"
            }
        ], 
        "list_section": [
            {
                "section_id": "230", 
                "breif": "招标大米第一标段"
                
            }, 
            {
                "section_id": "231", 
                "breif": "招标大米第二标段"
                
            }, 
            {
                "section_id": "232", 
                "breif": "招标大米第三标段"
            }
        ], 
        "list_supply_school": [
            {
                "supply_id": "1", 
                "section_id": "231", 
                "supply_name": "肉类供应商", 
                "section_name": "招标大米第二标段"
            }, 
            {
                "supply_id": "2",
                "section_id": "232",
                "supply_name": "果蔬供应商", 
                "section_name": "招标大米第三标段"
            }, 
            { 
                "supply_id": "12", 
                "section_id": "230",
                "supply_name": "优良食品有限公司", 
                "section_name": "招标大米第一标段"
            }
        ], 
        "select_limit": 1
    }
}
我的想法是做一个标段列表（列表数据在list_section里），每个标段可以选择供应商（选择供应商是下拉框形式选择，在list_supply数据里），这些都做出来了，但是现在我想，将标段选择供应商的默认选项是list_supply_school里对应的内容，也就是说section_id =231的默认选择是肉类供应商，求大神告知，谢谢！


下面是我写的代码：
<script>
var jsons = {
"code": 200,
"msg": "执行成功！",
"data": {
"list_supply": [{
"supply_id": "1",
"supply_name": "肉类供应商"
}, {
"supply_id": "2",
"supply_name": "果蔬供应商"
}, {
"supply_id": "12",
"supply_name": "优良食品有限公司"
}],
"list_section": [{
"section_id": "230",
"breif": "招标大米第一标段",
"dep_id": "86"

}, {
"section_id": "231",
"breif": "招标大米第二标段",
"dep_id": "86"

}, {
"section_id": "232",
"breif": "招标大米第三标段",
"dep_id": "86"
}],
"list_supply_school": [{
"supply_id": "1",
"section_id": "231",
"supply_name": "肉类供应商",
"section_name": "招标大米第二标段"
}, {
"supply_id": "2",
"section_id": "232",
"supply_name": "果蔬供应商",
"section_name": "招标大米第三标段"
}, {
"supply_id": "12",
"section_id": "230",
"supply_name": "优良食品有限公司",
"section_name": "招标大米第一标段"
}],
"select_limit": 1
}
};
var arr1 = [];
for(var i = 0, L = jsons.data.list_section.length; i < L; i++) {
var Breif = jsons.data.list_section[i].breif;
var section_id = jsons.data.list_section[i].id;
var dep_id = jsons.data.list_section[i].dep_id;
//alert(dep_id);
var arr2 = [];
for(var j = 0, K = jsons.data.list_supply.length; j < K; j++) {
var supply_name = jsons.data.list_supply[j].supply_name;
var supply_id = jsons.data.list_supply[j].supply_id;
//alert(supply_id);
arr2.push("<option value='" + supply_id + "'>" + supply_name + "</option>");
}

arr1.push("<ul class='mui-table-view mui-table-view-striped mui-table-view-condensed'><li class='mui-table-view-cell'><div class='mui-table'><div id='info' class='mui-table-cell mui-col-xs-10'><h4 class='mui-ellipsis'>" + Breif + "</h4><div class='mui-h5'>选供应商：</div><div class='mui-content-padded'><select id=" + section_id + " style='background-color: lightyellow;'  name='section_info_school[ " + dep_id + "-" + section_id + "]'  class='mui-btn mui-btn-block'><option value='' class='do' ></option>" + arr2 + "</select></div></div><div class='mui-table-cell mui-col-xs-2 mui-text-right'></div></div></li></ul>");
document.getElementById("opt").innerHTML = arr1.join('');
var sel = document.getElementById(section_id);
//alert(sel.options.length);
for(var m = 0; m < sel.options.length; m++) {
var list = jsons.data.list_supply_school; //
//console.log(list);
//alert(list.length);
for(var n = 0, L = list.length; n < L; n++) {
var temp_name = list[n].supply_name;
var temp_id = list[n].section_id;
if(temp_id == section_id) {
hidden = temp_name;
alert(hidden);
if(sel.options[m].innerHTML == hidden) {
sel.options[m].selected = "selected";
break;
}
}
} //
}
}
</script>

3 个解决方案

#1

html 代码：
<body>
<header class="mui-bar mui-bar-nav" style="background-color: aquamarine;">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">demo</h1>
</header>
<div class="mui-content">
<form id="opt" method="post" action="">

</form>
<button id="btn" type="button" class="mui-btn mui-btn-primary">提交</button>
</div>
</body>

#2

http://bbs.csdn.net/topics/392027802

#3

引用 2 楼 showbo 的回复:

http://bbs.csdn.net/topics/392027802

就一个下拉框，下拉框默认选项selected =selected 这一块是从jsons里取的