javaScript 의 select 요소 와 option 의 관련 작업
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <title></title> 5 <!-- jquery--> 6 <script src="../Script/jQuery/jquery-1.6.2.min.js" type="text/javascript"></script> 7 <script type="text/javascript"> 8 $(function () { 9 createSelect("select", "addSel"); 10 addOption("addSel", "first", " "); 11 addOption("addSel", "secord", " "); 12 addOption("addSel", "three", " "); 13 addOption("addSel", "four", " "); 14 addOption("addSel", "fives", " "); 15 removeOneByIndex("addSel", 0); 16 removeOneByObj("addSel", "secord"); 17 18 // option 19 $("#addSel").change(function () { 20 alert(" :"+getOptionText("addSel") + " Value:" + getOptionValue("addSel")); 21 editOptions("addSel", " "," Value"); // : value value text 22 alert(" :" + getOptionText("addSel") + " Value:" + getOptionValue("addSel")); 23 }) 24 }) 25 26 // id 27 function createSelect(element, id) { 28 var select = document.createElement(element); 29 select.id = id; 30 document.body.appendChild(select); 31 } 32 33 // select id option 34 function addOption(selectID,value,text) { 35 // id , 36 var obj = document.getElementById(selectID); 37 obj.options.add(new Option(text, value)); // IE firefox 38 } 39 40 // option 41 function removeAll(selectID) { 42 var obj = document.getElementById(selectID); 43 obj.options.length = 0; 44 } 45 46 // index option 47 function removeOneByIndex(selectID,index) { 48 var obj = document.getElementById(selectID); 49 //index, , 50 //var index = obj.selectedIndex;// index; 51 obj.options.remove(index); 52 } 53 54 // value text option 55 function removeOneByObj(selectID, textOrValue) { 56 var obj = document.getElementById(selectID); 57 //index, , 58 //var index = obj.selectedIndex;// index; 59 for (var i = 0; i < obj.options.length; i++) { 60 if (obj.options[i].innerHTML == textOrValue || obj.options[i].value == textOrValue) { 61 obj.options.remove(i); 62 break; 63 } 64 } 65 } 66 67 // Option Value; 68 function getOptionValue(selectID){ 69 var obj = document.getElementById(selectID); 70 var index=obj.selectedIndex; // , 71 var val = obj.options[index].value; 72 return val; 73 } 74 75 // option Text; 76 function getOptionText(selectID) { 77 var obj = document.getElementById(selectID); 78 var index=obj.selectedIndex; // , 79 var val = obj.options[index].text; 80 return val; 81 } 82 83 // option 84 function editOptions(selectID,newText,newValue) { 85 var obj = document.getElementById(selectID); 86 var index=obj.selectedIndex; // , 87 obj.options[index] = new Option(newText, newValue); 88 obj.options[index].selected = true; 89 } 90 91 // select 92 function removeSelect(){ 93 var select = document.getElementById("select"); 94 select.parentNode.removeChild(select); 95 } 96 </script> 97 </head> 98 <body> 99 100 </body> 101 </html>
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.