javascript 셀렉트박스 2중선택 다중
페이지 정보
작성자 미친새 작성일 20-02-21 10:33 조회 18,550 댓글 0본문
<script type=\"text/javascript\">
function addrchang(val){
//alert(val.value);
var gu = [[\"구로구\",\"관악구\",\"영등포구\"],[\"성남시\",\"광명시\",\"일산시\"],[\"충주시\",\"청주시\"]];
if(val.value == \"서울시\"){var du = 0;}else if(val.value == \"경기도\"){var du = 1;}else if(val.value == \"충청도\"){var du = 2;}
//if(){
//for(var i=0;i<2;i++){
for(var i=0;i<val.length;i++){
//var option = new Option();
//option.value = \"안녕\";
//option.text = \"안녕\";
if(du == i){
//for(var g=0;g<3;g++){
for(var g=0;g<gu[du].length;g++){
var option = new Option();
option.value = gu[i][g];
option.text = gu[i][g];
test.addr2.options.add(option);
}
//document.write(\"gu[\"+i+\"][\"+g+\"]\"+gu[i][g]);
}
//selectBox.options.add(option);
//test.addr2.options.add(option);
//addr2.options.add(option);
}
//}
}
function removechang(val){
for(var i=0;i<2;i++){
for(var g=0;g<3;g++){
test.addr2.options.remove(0);
}
}
}
function addrchang1(val){
var gu = [\"구로구\",\"관악구\",\"영등포구\"];
for(var i=0;i<3;i++){
var option = new Option();
option.value = gu[i];
option.text = gu[i];
test1.addr21.options.add(option);
}
}
function removechang1(val){
for(var i=0;i<3;i++){
test1.addr21.options.remove(0);
}
}
function addrchang2(val){
var gu = [[\"구로구\",\"관악구\",\"영등포구\"],[\"성남시\",\"광명시\",\"일산시\"],[\"충주시\",\"청주시\"]];
if(val.value == \"서울시\"){var du = 0;}else if(val.value == \"경기도\"){var du = 1;}else if(val.value == \"충청도\"){var du = 2;}
for(var i=0;i<val.length;i++){
if(du == i){
for(var g=0;g<gu[du].length;g++){
var option = new Option();
option.value = gu[i][g];
option.text = gu[i][g];
test2.addr22.options.add(option);
}
}
}
}
function removechang2(val){
for(var i=0;i<2;i++){
for(var g=0;g<3;g++){
test2.addr22.options.remove(0);
}
}
}
function addrchang3(val){
var gu = [[\"분당구\",\"중원구\",\"수정구\"],[\"광명1동\",\"광명2동\",\"광명3동\"],[\"일산1동\",\"일산2동\"]];
if(val.value == \"성남시\"){var du = 0;}else if(val.value == \"광명시\"){var du = 1;}else if(val.value == \"일산시\"){var du = 2;}
for(var i=0;i<val.length;i++){
if(du == i){
for(var g=0;g<gu[du].length;g++){
var option = new Option();
option.value = gu[i][g];
option.text = gu[i][g];
test2.addr32.options.add(option);
}
}
}
}
function removechang3(val){
for(var i=0;i<2;i++){
for(var g=0;g<3;g++){
test2.addr32.options.remove(0);
}
}
}
</script>
</head>
<body>
<form name=\"test\">
<select name=\"addr1\" onchange=\"javascript:removechang(this);addrchang(this);\">
<option value=\"서울시\">서울시</option>
<option value=\"경기도\">경기도</option>
<option value=\"충청도\">충청도</option>
</select>
<select name=\"addr2\">
</select>
</form>
<br>
<form name=\"test1\">
<select name=\"addr11\" onchange=\"javascript:removechang1(this);addrchang1(this);\">
<option value=\"서울시\">서울시</option>
<option value=\"경기도\">경기도</option>
</select>
<select name=\"addr21\">
</select>
</form>
<br>
<form name=\"test2\">
<select name=\"addr12\" onchange=\"javascript:removechang2(this);addrchang2(this);\">
<option value=\"서울시\">서울시</option>
<option value=\"경기도\">경기도</option>
<option value=\"충청도\">충청도</option>
</select>
<select name=\"addr22\" onchange=\"javascript:removechang3(this);addrchang3(this);\">
</select>
<select name=\"addr32\">
</select>
</form>
</body>
function addrchang(val){
//alert(val.value);
var gu = [[\"구로구\",\"관악구\",\"영등포구\"],[\"성남시\",\"광명시\",\"일산시\"],[\"충주시\",\"청주시\"]];
if(val.value == \"서울시\"){var du = 0;}else if(val.value == \"경기도\"){var du = 1;}else if(val.value == \"충청도\"){var du = 2;}
//if(){
//for(var i=0;i<2;i++){
for(var i=0;i<val.length;i++){
//var option = new Option();
//option.value = \"안녕\";
//option.text = \"안녕\";
if(du == i){
//for(var g=0;g<3;g++){
for(var g=0;g<gu[du].length;g++){
var option = new Option();
option.value = gu[i][g];
option.text = gu[i][g];
test.addr2.options.add(option);
}
//document.write(\"gu[\"+i+\"][\"+g+\"]\"+gu[i][g]);
}
//selectBox.options.add(option);
//test.addr2.options.add(option);
//addr2.options.add(option);
}
//}
}
function removechang(val){
for(var i=0;i<2;i++){
for(var g=0;g<3;g++){
test.addr2.options.remove(0);
}
}
}
function addrchang1(val){
var gu = [\"구로구\",\"관악구\",\"영등포구\"];
for(var i=0;i<3;i++){
var option = new Option();
option.value = gu[i];
option.text = gu[i];
test1.addr21.options.add(option);
}
}
function removechang1(val){
for(var i=0;i<3;i++){
test1.addr21.options.remove(0);
}
}
function addrchang2(val){
var gu = [[\"구로구\",\"관악구\",\"영등포구\"],[\"성남시\",\"광명시\",\"일산시\"],[\"충주시\",\"청주시\"]];
if(val.value == \"서울시\"){var du = 0;}else if(val.value == \"경기도\"){var du = 1;}else if(val.value == \"충청도\"){var du = 2;}
for(var i=0;i<val.length;i++){
if(du == i){
for(var g=0;g<gu[du].length;g++){
var option = new Option();
option.value = gu[i][g];
option.text = gu[i][g];
test2.addr22.options.add(option);
}
}
}
}
function removechang2(val){
for(var i=0;i<2;i++){
for(var g=0;g<3;g++){
test2.addr22.options.remove(0);
}
}
}
function addrchang3(val){
var gu = [[\"분당구\",\"중원구\",\"수정구\"],[\"광명1동\",\"광명2동\",\"광명3동\"],[\"일산1동\",\"일산2동\"]];
if(val.value == \"성남시\"){var du = 0;}else if(val.value == \"광명시\"){var du = 1;}else if(val.value == \"일산시\"){var du = 2;}
for(var i=0;i<val.length;i++){
if(du == i){
for(var g=0;g<gu[du].length;g++){
var option = new Option();
option.value = gu[i][g];
option.text = gu[i][g];
test2.addr32.options.add(option);
}
}
}
}
function removechang3(val){
for(var i=0;i<2;i++){
for(var g=0;g<3;g++){
test2.addr32.options.remove(0);
}
}
}
</script>
</head>
<body>
<form name=\"test\">
<select name=\"addr1\" onchange=\"javascript:removechang(this);addrchang(this);\">
<option value=\"서울시\">서울시</option>
<option value=\"경기도\">경기도</option>
<option value=\"충청도\">충청도</option>
</select>
<select name=\"addr2\">
</select>
</form>
<br>
<form name=\"test1\">
<select name=\"addr11\" onchange=\"javascript:removechang1(this);addrchang1(this);\">
<option value=\"서울시\">서울시</option>
<option value=\"경기도\">경기도</option>
</select>
<select name=\"addr21\">
</select>
</form>
<br>
<form name=\"test2\">
<select name=\"addr12\" onchange=\"javascript:removechang2(this);addrchang2(this);\">
<option value=\"서울시\">서울시</option>
<option value=\"경기도\">경기도</option>
<option value=\"충청도\">충청도</option>
</select>
<select name=\"addr22\" onchange=\"javascript:removechang3(this);addrchang3(this);\">
</select>
<select name=\"addr32\">
</select>
</form>
</body>
댓글목록 0
등록된 댓글이 없습니다.