체크박스 선택 시, 체크된 항목 출력
본문
<tr>
<td class="program_list swdeveloper" style="display:none;">
<label class="program able"><span></span><input type="checkbox" name="wr_8[]" value="선택1"> 선택1 </label>
<label class="program able"><span></span><input type="checkbox" name="wr_8[]" value="선택2"> 선택2 </label>
<label class="program able"><span></span><input type="checkbox" name="wr_8[]" value="선택3"> 선택3 </label>
<label class="program able"><span></span><input type="checkbox" name="wr_8[]" value="선택4"> 선택4 </label>
<script>
var str_wr_8 = "<?=@$write['wr_8']?>";
$("input:checkbox[name='wr_8[]']").each(function(index){
if(str_wr_8.indexOf($(this).val()) > -1){
$(this).attr("checked", true);
}
});
</script>
</td>
</tr>
<tr>
<th scope="row">선택한 프로그램</th>
<td>
<p class="val1"></p>
</td>
<script>
$("label.program input").change(function(){
$(".val1").text( $(this).val());
});
</script>
</tr>
이런식으로 "label.program input가 체크되었을 때 체크된 값들을
val1에 출력하려고 합니다.
근데 체크박스이다보니, 여러게를 선택하게끔 하게 되어있는데, 한개씩만 출력이 되더라구요....
누적이 되게끔 하고 싶은데, 방법이 있을까요?
체크되어있는 값만 출력하면 되는데, 만약 체크가 취소되면 없어지게끔도 가능할까요?
답변 2
<script>
$("label.program input").on('change', function(){
var arr = [];
$("label.program input:checked").each(function() {
arr.push($(this).val());
});
$(".val1").text(arr.join(','));
});
</script>
에고 감사합니다 ^^ 혹시 , 대신 한줄내리는건 어려울까요 ㅠ?
$(".val1").html(arr.join('<br>'));
너무 감사드립니다.. ㅎㅎ
혹시 응용적으로 선택값들을 선택할때, val1이 늘어나는 형식으로는 코드가 굉장히 까다로울까요?
잘 모르겠습니다만, 그럴 것 같습니다.
<script type='text/javascript'>
<!--
function function_click() {
var str = "";
$("input:checkbox:checked").each(function (index) {
str += $(this).val() + ",";
});
return str;
// alert(str);
}
//-->
</script>
알러트풀어서 확인하려고 하는데 아무런 동작이 없네요 ㅠㅠ
답변을 작성하시기 전에 로그인 해주세요.
