for문 레이어 팝업
본문
for 문안에서 레이어 팝업을 보여주고 있는데요.
클릭시 보이는거는 각 게시물 별로 잘 보이는데 닫히질 않는데.. 어떻게 수정을 해줘야 할까요?
<?php
for ($i=0; $row=sql_fetch_array($result); $i++) {
?>
<style>
#sign_pop { display:none; position:fixed; width:100%; height:100%; top:0; left:0; background:rgba(0,0,0,.8); z-index:9999999 }
#sign_pop .wrap { position:relative; max-width:300px; padding:10px; top:50%; left:50%; transform:translate(-50%, -50%) }
#sign_pop .wrap .area { background:#fff; padding:10px; }
#sign_pop button.close_pop { position:absolute; width:40px; height:40px; right:-30px; top:-30px; background:url('<?php echo G5_ADMIN_URL ?>/img/close_btn.png') no-repeat; border:0; }
</style>
<script>
$(function(){
var pop = $(".pop_<?php echo $row['wr_id'] ?>");
var close = $(".close_<?php echo $row['wr_id'] ?>");
$('.sign').on("click", function(){
$(this).children(pop).show();
});
$(close).on("click", function(){
$(this).parent().parent().hide();
});
});
</script>
<tr>
<td><b><?php echo $row['wr_id'] ?></b></td>
<td><?php echo $row['od_name'] ?>(<?php echo $row['od_id'] ?>)</td>
<td><?php echo $row['wr_6'] ?></td>
<td>결제완료</td>
<td><?php echo date("Y-m-d", strtotime($row['wr_datetime'])); ?></td>
<td class="sign">
<!-- 레이어 -->
<div id="sign_pop">
<div class="wrap">
<button type="button" class="close_pop"></button>
<div class="area">
<img src="<?php echo $row['od_sign'] ?>">
</div>
</div>
</div>
<!-- // 레이어 -->
<div>
<img src="<?php echo $row['od_sign'] ?>">
</div>
</td>
</tr>
답변 1
위의 소스에서는
for문을 열어서 닫는 구문이 없네요
그리고,
for문안에
style의
#id 값 들이 동일하게 중복되면
스타일이 어떤게 적용될지 알기어려운것이 첫번재 변수이구요
각 태그의 id가 중복되면 스크립트상에서 접근할 ID를 알수 없습니다.
동일하게 하시려면
<style> for문 밖으로 빼시는게 낫고
<script>도 마찬가지구요
각 HTML 태그들도 이유가 있어서 반복수행할게 아니라면
굳이 for문 안에 둘 필요는 없습니다.
읽어드리는 레코드가 1개라면 다행이지만
그렇지 않고 1개보다 많으면 그 이후부터는 오류가 발생합니다.
for문안에서 style를 적용하게 하시려는게 의도라면
class 를 활용하시는게 낫습니다.
답변을 작성하시기 전에 로그인 해주세요.
