SIR
이전 목록 다음
채택완료

그누x쵸딩입니다. 즐거운 한주 되세요~

그그누x쵸딩
프로필 보기이 회원 글보기이 회원의 댓글보기
 5년 전 4,884

체크박스 전체선택 해제만 있는데요,,,

제가 식상한거는 안조아해서요,,,ㅋㅋ

 

체크박스가 아주 많다면

인풋하나 두고 거기에 13쓰고 엔터때리면

 

위에서부터 체크박스가 13개 선택되는

이런 소스없을까요?

비슷한거 찾았는데

 

https://jsfiddle.net/3615ze29/2/

 

요걸 어뜨케 고치면 될까요?  ㅎㅎㅎ

 

그누보드5 php 그누보드4 그누커머스 영카트5
|

답변 2개 / 댓글 10개

채택된 답변
+20 포인트
sad4u
프로필 보기이 회원 글보기이 회원의 댓글보기
 5년 전

Copy 
<input type="text" id="numberInput" />

<script>


$(document).ready(function() {
    $("#numberInput").keydown(function(key) {
        if (key.keyCode == 13) {
            numChks(this.value);
        }
    });
});




function numChks(value){
    var list = $('input[type="checkbox"]');
    if(value<=list.length){
        for(var i=0;i<=value;i++){
            $(list[i]).attr('checked',true);
        }
    }
}

</script>

input에서 enter키 입력하면 동작할겁니다. 다른 부분들도 응용하시면 될 거 같습니다

답변에 대한 댓글 8개

그누x쵸딩
프로필 보기이 회원 글보기이 회원의 댓글보기
 5년 전
무척 고맙습니다~
sinbi
프로필 보기이 회원 글보기이 회원의 댓글보기
 5년 전
덕분에 저도 공부가 되었는데,
위 코드로 테스트 해보니,
처음 입력 숫자보다 작은 숫자를 입력하면 안 바뀌는 것 같아요.
큰 숫자를 입력하면 큰 숫자 만큼 바뀌구요...

위 소스 상으로는 그럴 이유가 없어 보이는데... 왜 그런걸까요?
sad4u
프로필 보기이 회원 글보기이 회원의 댓글보기
 5년 전
sinbi //
아마 체크박스에 체크가 되어있기에 입력숫자보다 적게 입력해도 ui특성상 이미 체크되어 있는 것으로 보이기에 반복문 돌기전에 체크박스에 걸려있는 체크를 먼저 풀어주세요.
[code]
function numChks(value){
var list = $('input[type="checkbox"]');
$('input[type="checkbox"]').attr('checked', false);
for(var i=0;i<=value;i++){
$(list[i]).attr('checked',true);
}
}
[/code]
조건문을 응용하시면 더 넓게 쓰실 수 있을 겁니다.
그누x쵸딩
프로필 보기이 회원 글보기이 회원의 댓글보기
 5년 전
제코드가 for문안에 써야 해서 적용하니 안되네요..

$('#chk_num').on("keyup", function () {
var list = $('input[name="<?php echo 'sport'.$k;?>"]');
var number = $('#chk_num').val();

if(number<list.length)
for(var i=0;i<number;i++){
$(list[i]).attr('checked',true);
}

});

이렇게 하면 되는데..
문제는 기입한 만큼만 체크되어야 하는데

name이 모두 달라서 그러는지...
모두 체크되어 버리네요,,,

$('input[name="<?php echo 'sport'.$k;?>"]'); 이부분을 클래스로 처리할 수 없을까요?
sad4u
프로필 보기이 회원 글보기이 회원의 댓글보기
 5년 전
그누x쵸딩 //
네임을 클래스로 변경하신다면
[code]
var list = $('input[name="<?php echo 'sport'.$k;?>"]');
[/code]
이부분을
[code]
var list = $('."<?php echo 'sport'.$k;?>"');
[/code]
로 변경하심 될겁니다.
.를 #으로 바꾸면 id로 적용하여 사용할 수도 있습니다.
그누x쵸딩
프로필 보기이 회원 글보기이 회원의 댓글보기
 5년 전
아 감사합니다 ㅎㅎ

var list = $('.sport'); 바로 이렇게 하면됩니다..
이걸 두고 별짓을 다했습니다..ㅋ
그누x쵸딩
프로필 보기이 회원 글보기이 회원의 댓글보기
 5년 전
너무 잘돼서 다시 왔습니다.ㅋㅋ
알려주신대로 for문 위에 넣으니 숫자 감소에도 잘됩니다. 감사합니다.
sinbi
프로필 보기이 회원 글보기이 회원의 댓글보기
 5년 전
@sad4u 자세한 설명 감사합니다.
근데, 실제 저렇게 해봐도 작동 안 되는 것 같아요.
왕왕까마중
프로필 보기이 회원 글보기이 회원의 댓글보기
 5년 전

select box change 이벤트 걸고 -> 체크박스 each 돌려서

select 값으로 비교하면서 체크하면 될꺼같은데요?

10개 20개 이렇게는 되는데 20개 -> 10개 체크되었을때는 안되니

change 이벤트 발생할때 전부 체크 해제 시킨후 다시 체크하면 될꺼같네요

잠깐 테스트해보니 되기는하네요

 

Copy 
<select class="change">
    <option value=""></option>
    <option value="10">10</option>
    <option value="20">20</option>
</select>

 

<?php for($i=0; $i<=30; $i++){?>
<div>
    <input type="checkbox" class="chk" value="<?php echo $i?>" style="border:1px solid red; position:static; height:20px; width:20px">
</div>
<?php } ?>

 

<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>

답변에 대한 댓글 2개

그누x쵸딩
프로필 보기이 회원 글보기이 회원의 댓글보기
 5년 전
아 감사합니다~
그누x쵸딩
프로필 보기이 회원 글보기이 회원의 댓글보기
 5년 전
제코드에서는 이상하게 안되네요

제코드가 for문안에 적용하려다 보니 안되는가 봐요..

$('#chk_num').on("keyup", function () {
var list = $('input[name="<?php echo 'sport'.$k;?>"]');
var number = $('#chk_num').val();

if(number<list.length)
for(var i=0;i<number;i++){
$(list[i]).attr('checked',true);
}

});

이렇게 하면 되는데..
문제는 기입한 만큼만 체크되어야 하는데

name이 모두 달라서 그러는지...
모두 체크되어 버리네요,,,

$('input[name="<?php echo 'sport'.$k;?>"]'); 이부분을 클래스로 처리할 수 없을까요?

답변을 작성하려면 로그인이 필요합니다.

🐛 버그신고