遍歷json數組 並動態為select添加option
直接上代碼，重要部分有注解
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,viewport-fit=cover">
<link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/1.1.2/weui-for-work.css">
<script type="text/javascript" src="../lib/zepto.min.js"></script>
<script type="text/javascript" src="../lib/jquery-1.9.1.min.js"></script>
<title>任務發布</title>
</head>
<body>
<form method="post" action="">
<div class="weui-cells__title" style="margin-top: 30px">項目名稱</div>
<div class="weui-cells">
<div class="weui-cell">
<select class="weui-cell__bd" name="pro_id" id="sel">
</select>
</div>
</div>
<div class="weui-cells__title" style="margin-top: 30px">任務名稱</div>
<div class="weui-cells">
<div class="weui-cell">
<div class="weui-cell__bd">
<input class="weui-input" type="text" placeholder="請輸入任務名稱" name="task_name"/>
</div>
</div>
</div>
<div class="weui-cells__title" style="margin-top: 30px">任務內容</div>
<div class="weui-cells weui-cells_form">
<div class="weui-cell">
<div class="weui-cell__bd">
<textarea class="weui-textarea" placeholder="請輸入內容" rows="7" name="task_content"></textarea>
</div>
</div>
</div>
<div class="weui-cells__title" style="margin-top: 30px">任務期限</div>
<div class="weui-cells weui-cells_form">
<div class="weui-cell">
<div class="weui-cell__hd"><label class="weui-label">時間</label></div>
<div class="weui-cell__bd">
<input class="weui-input" type="datetime-local" value="" placeholder="" name="task_time"/>
</div>
</div>
</div>
<div class="weui-cells__title" style="margin-top: 30px">任務級別</div>
<div class="weui-cells weui-cells_radio">
<label class="weui-cell weui-check__label" for="x11">
<div class="weui-cell__bd">
<p>高</p>
</div>
<div class="weui-cell__ft">
<input type="radio" class="weui-check" name="radio1" id="x11" value="2"/>
<span class="weui-icon-checked"></span>
</div>
</label>
<label class="weui-cell weui-check__label" for="x12">
<div class="weui-cell__bd">
<p>中</p>
</div>
<div class="weui-cell__ft">
<input type="radio" name="radio1" class="weui-check" id="x12" checked="checked" value="1"/>
<span class="weui-icon-checked"></span>
</div>
</label>
<label class="weui-cell weui-check__label" for="x13">
<div class="weui-cell__bd">
<p>低</p>
</div>
<div class="weui-cell__ft">
<input type="radio" name="radio1" class="weui-check" id="x13" checked="checked" value="0"/>
<span class="weui-icon-checked"></span>
</div>
</label>
</div>
<div class="weui-btn-area" style="margin-top: 30px ;padding-bottom: 100px">
<input class="weui-btn weui-btn_primary" onclick="sub()" value="確定" type="submit"/>
</div>
</form>
<script type="text/javascript">
/**
* 使用ajax獲取服務器json 數組
*/
var httpRequest = new XMLHttpRequest();
httpRequest.open('GET', 'http://www.-------', true);
/**
* 獲取數據后的處理程序
*/
httpRequest.onreadystatechange = function () {//固定寫法
if (httpRequest.readyState == 4 && httpRequest.status == 200) {//固定寫法
var json = httpRequest.responseText;//獲取到json字符串，還需解析
var obj = JSON.parse(json);//解析字符串---解析成object數組
for (var i = 0; i < obj.length; i++) {
var pro = obj[i];
document.getElementById("sel").options.add(new Option(pro.corp_name, pro.project_id));//使用純js為select動態添加option
}
}
}
httpRequest.send();
</script>
</body>
</html>