Iframe 드롭다운 상자 연동

드롭다운 상자 페이지:

  
  
  
  
  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. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
  5. <title> SELECT</title> 
  6. <script> 
  7. function fun1(){  
  8.     document.getElementById("iframe1").src="iframe1.html";  
  9. }  
  10. </script> 
  11. </head> 
  12.  
  13. <body> 
  14. SELECT1<select id="select1" onchange="fun1();"> 
  15. <option value="0">--- ---</option> 
  16. <option value="1"> </option> 
  17. <option value="2"> </option> 
  18. <option value="3"> </option> 
  19. </select> 
  20. SELECT2<select id="select2" > 
  21. <option value="0">--- ---</option> 
  22. </select> 
  23. <iframe id="iframe1" style="display:none"></iframe> 
  24. </body> 
  25. </html> 

Iframe 페이지:

  
  
  
  
  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. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
  5. <title> SELECT2</title> 
  6. <script> 
  7. </script> 
  8. </head> 
  9.  
  10. <body> 
  11. <script> 
  12. var select1 = parent.document.getElementById("select1");  
  13. var select2 = parent.document.getElementById("select2");  
  14.  
  15.  
  16. if(select1.value=="1"){  
  17.     select2.length=1;  
  18.     var ooption = document.createElement("option");   
  19.     ooption.value = "1";  
  20.     ooption.innerHTML=" ";  
  21.     select2.appendChild(ooption);  
  22.     ooption = document.createElement("option");   
  23.     ooption.value = "2";  
  24.     ooption.innerHTML=" ";  
  25.     select2.appendChild(ooption);  
  26. }  
  27. else if(select1.value=="2")  
  28. {  
  29.     select2.length=1;  
  30.     var ooption = document.createElement("option");   
  31.     ooption.value = "1";  
  32.     ooption.innerHTML=" ";  
  33.     select2.appendChild(ooption);  
  34.     ooption = document.createElement("option");   
  35.     ooption.value = "2";  
  36.     ooption.innerHTML=" ";  
  37.     select2.appendChild(ooption);  
  38. }  
  39. else if(select1.value=="3"){  
  40.     select2.length=1;  
  41.     var ooption = document.createElement("option");   
  42.     ooption.value = "1";  
  43.     ooption.innerHTML=" ";  
  44.     select2.appendChild(ooption);  
  45.     ooption = document.createElement("option");   
  46.     ooption.value = "2";  
  47.     ooption.innerHTML=" ";  
  48.     select2.appendChild(ooption);  
  49. }  
  50. else{  
  51.     select2.length=1;  
  52. }  
  53.  
  54. </script> 
  55. </body> 
  56. </html> 

좋은 웹페이지 즐겨찾기