안녕하세요 option 값에 따른 색상변화에 관한 질문입니다!
본문
이렇게 write.skin .php 에 소스를 줬습니다
예를들어 pay_arr 에 ㄱㄱ , ㄴㄴ , ㄷㄷ 이라는 값이있어서 ㄱㄱ 을 선택했을시 ㄱㄱ은 빨간색
ㄴㄴ은 노란색 ㄷㄷ은 파란색을 주고싶은데요 ㅠㅠ
<th scope="row"><label for="wr_13">가나다라</label></th>
<td>
<select name="wr_13" id="wr_13">
<option value="">선택</option>
<?foreach($pay_arr AS $pVal){?>
<option value="<?=$pVal?>"<?php echo get_selected($wr_13, $pVal); ?>><?=$pVal?></option>
<?}?>
</select>
</td>
</tr>
list.skin.php엔 소스를
<td style="width:60px;text-align:center;"><?php echo $list[$i]['wr_13'] ?></td> <!-- 입금파트 -->
이렇게 되어있는데 어떻게 조건을 주면 좋을까요 ㅠㅠ
그리고 위와 같은 소스에서 ㄱㄱ 선택시 <td> 태그의 배경식을 바꾸는건 어떻게 조건을줘야할까요 ㅠㅠ
!-->!-->답변 3
위 내용 다 맞다면, 이렇게 하시면 돼요.
list.skin.php 에만요
<?php
$td_color_arr = array("ㄱㄱ"=>"td_red","ㄴㄴ"=>"td_yellow","ㄷㄷ"=>"td_blue");
?>
<style>
.td_red {background:#ff0033;}
.td_yellow {background:#ffff00;}
.td_blue {background:#0000ff;}
</style>
<td style="width:50px;text-align:center;" class="<?php echo $td_color_arr[$list[$i]['wr_11']];?>"><?php echo $list[$i]['wr_11'] ?></td>
<td style="width:60px;text-align:center;" class="<?php echo $td_color_arr[$list[$i]['wr_12']];?>"><?php echo $list[$i]['wr_12'] ?></td>
<td style="width:60px;text-align:center;" class="<?php echo $td_color_arr[$list[$i]['wr_13']];?>"><?php echo $list[$i]['wr_13'] ?></td>
jquery를 사용하신다면 아래와 비슷하게 하면 되지 않을까요?
td의 class혹은 id를 지정하시면 되겠습니다. 하나이니 td아이디를 td_bg라고 한다면
<td id='td_bg' style='width: ....
jquery는 아래와 같습니다.
$(function(){
$('#wr_13').change(function(){
if($(this).val() === 'ㄱㄱ')
{
$('#td_bg').css('background-color','red');
}
});
});
제이쿼리 사용하신다면 이렇게 하시면 돼요
!-->
<th scope="row"><label for="wr_13">가나다라</label></th>
<td>
<!-- onChange="color_change(this.value)" 추가-->
<select name="wr_13" id="wr_13" onChange="color_change(this.value)">
<option value="">선택</option>
<?foreach($pay_arr AS $pVal){?>
<option value="<?=$pVal?>"><?=$pVal?></option>
<?}?>
</select>
</td>
</tr>
<!-- class="color_tr" 추가-->
<td style="width:60px;text-align:center;" class="color_tr"><?php echo $list[$i]['wr_11'] ?></td> <!-- 입금파트 -->
<td style="width:60px;text-align:center;" class="color_tr"><?php echo $list[$i]['wr_12'] ?></td>
<td style="width:60px;text-align:center;" class="color_tr"><?php echo $list[$i]['wr_13'] ?></td>
<script>
function color_change(val){
var color = "#fff"; //기본 컬러
switch(val){
case "ㄱㄱ":
color = "#ff0033";
break;
case "ㄴㄴ":
color = "#ffff00";
break;
case "ㄷㄷ":
color = "#0000ff";
break;
default:
break;
}
$(".color_tr").css({"background":color});
}
</script>
답변을 작성하시기 전에 로그인 해주세요.