js添加,移除select 控件的option

<html>
 <head>

 <script>
 function addDefectOption(){
//找到select  控件
 var opts = document.getElementById("group");
 alert(opts.childNodes.length);
 //找出不良代碼節點的位置,在其之前插入不良代碼
 var opt = opts.childNodes[5];
 var flag = false;
 for(var i=0;i<opts.length;i++){
  var vtValue = opts.options[i].text;
 //如果不良代碼不存在,則flag=true;
  if(vtValue=="4."){
   flag = true;
  }
 }
 if(flag==false){
  el = document.createElement("option");
  //設置value爲12,顯示內容爲“不良代碼”的option
  el.value="12";
  el.appendChild(document.createTextNode("不良代碼"));
  //插入新增的option
  opts.insertBefore(el,opt);
 }
}

 function removeDefectOption(){
 var opts = document.getElementById("group");
 for(var i=0;i<opts.length;i++){
  var vtValue = opts.options[i].text;
 //如果不良代碼存在,則移出不良代碼的option項;
  if(vtValue=="2."){
   opts.remove(i);
   return;
  }
 
 }
}
 
 </script>
</head>
 <body/>
 <select name="group" id="group" >
  <option value="1">1.</option>
  <option value="2">2.</option>
  <option value="3">3.</option>

 </select>
 <input type="button" name="add" value="add" onClick="addDefectOption()"/>
 <input type="button" name="remove" value="remove" onClick="removeDefectOption()"/>
 </body>
</html>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章