채택완료

체크박스를 다중 선택할 때, 순서대로 연속해서 체크는 가능하나 중간을 뛰어 넘으면 경고창 띄우기에 대한 방법이 있을 까요?

2018-05-03 (목) 12:16:43 5,015

안녕하세요.

스크립트 질문입니다.

체크박스를 다중 선택할 때, 순서대로 연속해서 체크는 가능하나 중간을 뛰어 넘으면 경고창 띄우기에 대한 방법이 있을 까요?

선택 시 아래 방향으로 체크할 수도 있고 위 방향으로 있을 수 있고,

관련해서 구현 아이디어가 떠오르지 않네요 ㅠㅠ

Copy
<form name=fwrite>
<input type="checkbox" name="사과" onclick=showpicks() value="사과"><BR>
<input type="checkbox" name="배" onclick=showpicks() value="배"><BR>
<input type="checkbox" name="딸기" onclick=showpicks() value="딸기"><BR>
<input type="checkbox" name="수박" onclick=showpicks() value="수박"><BR>
<input type="checkbox" name="체리" onclick=showpicks() value="체리"><BR>
<input type="checkbox" name="오렌지" onclick=showpicks() value="오렌지"><BR>
</form>
|

답변 2개 / 댓글 1개

채택된 답변
+20 포인트
Copy
<form name=fwrite>
<input type="checkbox" name="사과"     class="fruit" value="사과">사과<BR>
<input type="checkbox" name="배"     class="fruit" value="배">배<BR>
<input type="checkbox" name="딸기"     class="fruit" value="딸기">딸기<BR>
<input type="checkbox" name="수박"     class="fruit" value="수박">수박<BR>
<input type="checkbox" name="체리"     class="fruit" value="체리">체리<BR>
<input type="checkbox" name="오렌지"     class="fruit" value="오렌지">오렌지<BR>
</form>


<script>


$(function(){

    $(".fruit").click(function(){

        var fruit = new Array();
        var i=0;
        $(".fruit").each(function(index){
            if($(this).is(":checked")){
                fruit[i]=index;
                i++;
            }
        });

        if(fruit.length != 1){
            var temp = fruit[0];
            for(var k=1; k<fruit.length; k++){
                if(temp+k != fruit[k]){
                    alert("연속으로 체크하셔야 합니다.");
                    if($(this).is(":checked"))
                        $(this).is(":checked",false);
                    else
                        $(this).is(":checked",true);
                    return false;
                }
            }
        }
    });    
});
</script>

답변에 대한 댓글 1개

벌아뉨 ! 엄지척 !

showpicks(1~10) 함수에 idx 값을 주어서 순차적으로 데이터로 체크되어 있는지 체크 하는 방식이 있긴 합니다.

기존 체크값을 넘겨줘서 다음 번호에 해당된 값을 체크해서 받을수 있도록 하는 겁니다.

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