经常要弄一些联动菜单之类的效果，用js操作option就不可避免了。
一般这种特效需要我们实现两种操作：
- 清空option
- 根据ajax返回结果，动态创建option
经常要弄一些联动菜单之类的效果，用js操作option就不可避免了。
一般这种特效需要我们实现两种操作：
- 清空option
- 根据ajax返回结果，动态创建option
js清空option
清空option 不是很难的操作。我们只需要遍历现有option，将其每个子元素都置空即可。
function clearOption(selectId){
var selectObj = document.getElementById(selectId);
for(var i = 0,len = selectObj.options.length; i < len; i++){
selectObj.options[0] = null;
}
}
var selectObj = document.getElementById(selectId);
for(var i = 0,len = selectObj.options.length; i < len; i++){
selectObj.options[0] = null;
}
}
这里，大家可以思考一下为何options[0]而不是options[i]
js动态创建option
js创建Option的命令如下：
var newOption = new Option(optionTxt, optionVal);
据此，我们可以将Ajax返回的Json对象循环一下，来动态创建Option
function setSelectOption(selectId, optionList, firstOption, selected)
{
var selectObj = document.getElementById(selectId);
var cnt = 0;
if(firstOption){
selectObj.options[0] = new Option(firstOption,'');
cnt++;
}
for(var i = 0,len = optionList.length; i < len; i++){
selectObj.options[cnt] = new Option(optionList[i].txt, optionList[i].val);
if(selected == optionList[i].val){
selectObj.options[cnt].selected = true;
}
cnt++
}
}