좀 더 자세하게 질문드립니다.. div의 show, hide
본문
아버지 홈페이지 만들어드리고 있는데 이 부분에서 막힙니다.
write.php에서 라디오 버튼으로 매매, 전세, 월세를 선택하면
아래 양식이 변하도록 했습니다.
<input type="radio" name="wr_10" value="매매" <?php echo ($write['wr_10'] == "매매") ? " checked" : "";?> required>매매
<input type="radio" name="wr_10" value="전세" <?php echo ($write['wr_10'] == "전세") ? " checked" : "";?> required>전세
<input type="radio" name="wr_10" value="월세" <?php echo ($write['wr_10'] == "월세") ? " checked" : "";?> required>월세
<input type="hidden" id="radioId" value="매매">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// DOM 생성 완료 시 화면 숨김 (파라미터로 전달되는 id는 제외)
hideExclude("changes");
// radio change 이벤트
$("input[name=wr_10]").change(function() {
var radioValue = $(this).val();
if (radioValue == "매매") {
hideExclude("changes");
} else if (radioValue == "전세") {
hideExclude("changey");
} else if (radioValue == "월세") {
hideExclude("changem");
}
});
});
// text area 숨김
function hideExclude(excludeId) {
$("#changeTextArea").children().each(function() {
$(this).hide();
});
// 파라미터로 넘겨 받은 id 요소는 show
$("#" + excludeId).show();
}
</script>
<div id=changes>...</div>
<div id=changey>...</div>
<div id=changem>...</div>
이런식으로 구성했고요
그래서 view.php에서 이렇게 거래종류에 해당 값(wr_10)이 들어오면 표시해주고
그것으로 div show, hide를 시켜주려고 하는데
var trans = "<?php echo $view["wr_10"]; ?>";
if (trans == "매매") {
$("#changes").show();
$("#changey").hide();
$("#changem").hide();
} else if (trans == "전세") {
$("#changes").hide();
$("#changey").show();
$("#changem").hide();
} else if (trans == "월세") {
$("#changes").hide();
$("#changey").hide();
$("#changem").show();
}
이 작동하지 않습니다...
wr_10이 넘어오지 않는가 싶어서 <?php echo $view['wr_10']; ?> 을 해보면
매매 전세 월세 글자 표시는 됩니다.
현 상태는 show, hide가 먹질 않아서 거래 종류에 관계없이 모든 가격 div가 표시된 상태입니다.
2번째 사진처럼 표시하려면 어떻게 해야할지 고수님들의 조언이 절실합니다... ㅜㅜ
답변 2
혹시 자바스크립트를 dom이 표시되기 전에 위치한 것인지요?
그렇다면 write.php 처럼
$(document).ready(function() {
});
로 감싸야 할 듯...
제 삽질을 한방에 날려주셨습니다. 고맙습니다!!!!
그냥 단순하게 if 문으로 하셔도 되지 않나요?
<?php if($view['wr_10'] == "매매") { ?>
<div id = 'changes'>
매매 관련 레이아웃
</div>
<?php } else if($view['wr_10'] == "전세") { ?>
<div id = 'changey'>
전세 관련 레이아웃
</div>
<?php } else if($view['wr_10'] == "월세") { ?>
<div id = 'changem'>
월세 관련 레이아웃
</div>
<?php } ?>
답변을 작성하시기 전에 로그인 해주세요.
