1、首先，jsp頁面table標籤下面有select標籤
<th>民族</th>
<td><select
class="form-control "
name="mz"
id="mz"><option
value="">請選擇</option></select></td>
2、在jQuery文檔加載裏面寫js
$(document).ready(function() {
var nations
= ["漢族","蒙古族","回族","藏族","維吾爾族","苗族","彝族","壯族","布依族","朝鮮族","滿族","侗族","瑤族","白族","土家族",
"哈尼族","哈薩克族","傣族","黎族","傈僳族","佤族","畲族","高山族","拉祜族","水族","東鄉族","納西族","景頗族","柯爾克孜族",
"土族","達斡爾族","仫佬族","羌族","布朗族","撒拉族","毛南族","仡佬族","錫伯族","阿昌族","普米族","塔吉克族","怒族",
"烏孜別克族",
"俄羅斯族","鄂溫克族","德昂族","保安族","裕固族","京族","塔塔爾族","獨龍族","鄂倫春族","赫哲族","門巴族","珞巴族","基諾族"];
var nation
= $("#mz");
for ( var
i=0;i<nations.length;i++)
{
var a=nations[i];
console.log(nations[i]);
nation.append("<option value='nations[i]'>"+a+"</option>");
}
});
以上就是該方法。該方法完美實現
下面講講我爲什麼要把方法寫在$(document).ready(function() {});該js下面了。
之前我寫的是給select標籤綁定了click事件，然後通過下拉框點擊調用56個民族數據，結果出現每點擊一次下拉框，56個民族就會變成原來的兩倍，
變成102個重複的，在點擊又翻一倍，無限循環，出現這個bug是因爲沒有將option裏面的數據在點擊前清除，但是我怎麼清除都不行，要不就是全清除
了，一個數據都沒了，只好採用上面的方法了。
下面是我的bug問題，請大家參考
$("#mz").click(function () {
initNations();
});
function initNations(){
var nations = ["漢族","蒙古族","回族","藏族","維吾爾族","苗族","彝族","壯族","布依族","朝鮮族","滿族","侗族","瑤族","白族","土家族",
"哈尼族","哈薩克族","傣族","黎族","傈僳族","佤族","畲族","高山族","拉祜族","水族","東鄉族","納西族","景頗族","柯爾克孜族",
"土族","達斡爾族","仫佬族","羌族","布朗族","撒拉族","毛南族","仡佬族","錫伯族","阿昌族","普米族","塔吉克族","怒族",
"烏孜別克族",
"俄羅斯族","鄂溫克族","德昂族","保安族","裕固族","京族","塔塔爾族","獨龍族","鄂倫春族","赫哲族","門巴族","珞巴族","基諾族"];
var nation = $("#mz");
for ( var i=0;i<nations.length;i++) {
var a=nations[i];
console.log(nations[i]);
nation.append("<option value='nations[i]'>"+a+"</option>");
}
}