jquery 체크박스 처리 관련 질문...
본문
<script src="http://code.jquery.com/jquery-latest.js"></script>
<select class="change">
<option value=""></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<input type="checkbox" class="chk" value="1">
<input type="checkbox" class="chk" value="2">
<input type="checkbox" class="chk" value="3">
<input type="checkbox" class="chk" value="4">
<input type="checkbox" class="chk" value="5">
<script>
$(document).ready(function(){
$(".change").change(function(){
var selVal = $(".change option:selected").val();
$(".chk").each(function(idx,item) {
if(idx < selVal){
$(this).attr("checked",true);
}else{
return false;
}
});
});
});
</script>
https://codepen.io/sinbi/pen/MWKbJrr
체크된 숫자보다 더 큰 숫자를 택하면 잘 선택되는데,
체크된 숫자보다 작은 숫자로 변경하면 작동 않는데..
잘 작동하게 하려면 어떻게 해야 하는지?
$(".chk").attr("checked",false);
위 구문을 반복문 시작 전에 넣어도 작동 안 되더구요.
답변 2
$(document).ready(function(){
$(".change").change(function(){
var selVal = $(".change option:selected").val();
$(".chk").each(function(idx,item) {
var val = $(this).val();
if(val < selVal){
$(this).prop("checked",true);
}else{
$(this).prop("checked",false);
}
});
});
});
일단 idx는 값이 아니래 index니 따로 val를 구하시고 크면 체크 아니면 체크 안하면 되지 않을까요? 다 돌면서요
테스트 해보니 잘 작동하네요. 고맙습니다.
https://codepen.io/sinbi/pen/pogNeWq
else에서 check된것을 false로 하면 숫자가 아래로 내려갈때도 될 것 같습니다.
$(document).ready(function(){
$(".change").change(function(){
var selVal = $(".change option:selected").val();
$(".chk").each(function(idx,item) {
if(idx < selVal){
$(this).attr("checked",true);
}else{
$(this).attr("checked",false);
}
});
});
});
관심 갖고 답변주셔서 감사합니다.
말씀하신 코드로 이미 테스트해봤는데, 잘 안 되더라구요.
https://codepen.io/sinbi/pen/qBbqroZ
