for 문으로 돌리는데 id로 묶어서 hide 시키고 싶습니다..
본문
for 문으로 돌리는데 id로 묶어서 hide 시키고 싶습니다..
for문 소스이고 td에 id 값을 줘서 각 버튼 클릭 시 원하는 방만 block 되도록 만들고 싶은데
아래 소스로 짜면 첫번째 선택 박스까지만 hide, block 되고 나머지 td 부분은 적용되지않네요..
어떻게 수정하면 될까요ㅜㅜ
<div id="myDIV">
<button class="btn1" onclick="return showOrHide('menulink1');">1</button>
<button class="btn1" onclick="return showOrHide('menulink2');">2</button>
<button class="btn1">3</button>
<button class="btn1">4</button>
<button class="btn1">5</button>
</div>
function showOrHide(zap) {
document.getElementById("menulink1").style.display = "none";
document.getElementById("menulink2").style.display = "none";
document.getElementById("menulink3").style.display = "none";
document.getElementById("menulink4").style.display = "none";
if (document.getElementById) {
var abra = document.getElementById(zap).style;
if (abra.display == "block") {
abra.display = "none";
} else {
abra.display = "block";
}
return false;
} else {
return true;
}
}
<?php
if ($cnt_room > 0) {
for ($z = 0; $z < 12; $z++) {
$zz = $z + 12;
$zzz = $z + 24;
////여기 넣을라고함
$max_day = $wzpconfig['pn_max_booking_day']; // 관리자에서 정해진 최대 예약일수.
if (isset($arr_status[$arr_room[$z]['rm_ix']]))
$max_day = $arr_status[$arr_room[$z]['rm_ix']]['max_day'];
$max_day1 = $wzpconfig['pn_max_booking_day']; // 관리자에서 정해진 최대 예약일수.
if (isset($arr_status[$arr_room[$zz]['rm_ix']]))
$max_day1 = $arr_status[$arr_room[$zz]['rm_ix']]['max_day'];
$max_day2 = $wzpconfig['pn_max_booking_day']; // 관리자에서 정해진 최대 예약일수.
if (isset($arr_status[$arr_room[$zzz]['rm_ix']]))
$max_day2 = $arr_status[$arr_room[$zzz]['rm_ix']]['max_day'];
?>
<tr style = background:#FEFBE5; >
<td id="menulink1" style="display:none;">
<?php if ($max_day) { ?>
<input type="hidden" name="rm_ix[<?php echo $z;?>]" id="rm_ix_<?php echo $z;?>" value="<?php echo $arr_room[$z]['rm_ix'];?>" />
<input type="checkbox" name="chk[]" id="chk_<?php echo $z;?>" value="<?php echo $z;?>" <?php echo $arr_room[$z]['rm_ix'] == $rm_ix ? 'checked' : '';?> />
<?php } else { ?>
-
<?php } ?>
</td>
<td id="menulink1" style="display:none;"><?php echo $arr_room[$z]['rm_subject'];?>
<input type="hidden" name="bk_day[<?php echo $z;?>]" id="bk_day_<?php echo $z;?>" value="1" />
</td>
<!--<td><?php echo $arr_room[$z]['rm_person_min'].'~'.$arr_room[$z]['rm_person_max'].'명';?></td>
<td>
<?php if ($max_day) { ?>
<select name="bk_day[<?php echo $z;?>]" id="bk_day_<?php echo $z;?>">
<?php
for ($i=1;$i<=$max_day;$i++) {
echo '<option value="'.$i.'" '.$selected.'>'.$i.'일</option>';
}
?>
</select>
<?php } else { ?>
-
<?php } ?>
</td>-->
<td id="menulink1" style="display:none;">
<?php if ($max_day) { ?>
<select name="bk_cnt_adult[<?php echo $z;?>]" id="bk_cnt_adult_<?php echo $z;?>" data-price="<?php echo $arr_room[$z]['rm_price_adult'];?>" data-min="<?php echo $arr_room[$z]['rm_person_min'];?>">
<?php
for ($i=$arr_room[$z]['rm_person_min'];$i<=$arr_room[$z]['rm_person_max'];$i++) {
$selected = '';
if ($i == $arr_room[$z]['rm_person_min'])
$selected = 'selected';
echo '<option value="'.$i.'" '.$selected.'>'.$i.'명</option>';
}
?>
</select>
<?php } else { ?>
-
<?php } ?>
</td>
답변 2
td의 id 는 모두 다르게 주어야 됩니다. 'menulink1', 'menulink2', ..
<div id="myDIV">
<button type="button" class="btn1" onclick="return showOrHide('menulink1');">1</button>
<button type="button" class="btn1" onclick="return showOrHide('menulink2');">2</button>
<button type="button" class="btn1" onclick="return showOrHide('menulink3');">3</button>
<button type="button" class="btn1" onclick="return showOrHide('menulink4');">4</button>
<button type="button" class="btn1" onclick="return showOrHide('menulink5');">5</button>
</div>
<script>
function showOrHide(zap) {
if (document.getElementById) {
var abra = document.getElementById(zap).style;
if (abra.display == "none") {
abra.display = "block";
} else {
abra.display = "none";
}
}
return false;
}
</script>
or
<script>
function showOrHide(zap) {
$('#' + zap).toggle();
}
</script>
tr 한줄에 여러개의 td가 있으면 각 td를 하나로 묶어서 한번에 숨기는 건 안되는건가요...?
한줄에 9개의 td가 있어서요..
같은 성격의 여러개는 class 로 지정해야 됩니다. https://boogis.tistory.com/48
<td class="menulink1">.</td>
<td class="menulink1">.</td>
<script>
function showOrHide(zap) {
$('.' + zap).toggle();
}
</script>
각기 다른 id 를 td 대신 tr 에 주시면 되요