본문으로 바로가기

<!--

    jQuery 를 이용하여 radio 버튼의 체크 유무 및 체크된 값을 검사합니다.

    jQuery 의 selector 부분이 중요 포인트로 4개의 구문으로 나눠 볼 수 있습니다.

     

    1. :input

        - Selects all input, textarea, select and button elements.

    2. [name=animal]

        - Selects elements that have the specified attribute with a value exactly equal to a certain value.

    3. :radio

        - Selects all elements of type radio.

    4. :checked

        - Matches all elements that are checked.

 -->

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>

<script type="text/javascript">

    function checkAnimal(){

        var animal = $(':input[name=animal]:radio:checked').val();

         

        if( animal ){

            alert(animal+"을 선택했습니다");

            return true;

        }else{

            alert("동물을 선택하세요");

            return false;

        }  

    }

</script>


<form onsubmit="return checkAnimal()">

    <input type="radio" name="animal" value="Dog">Dog

    <input type="radio" name="animal" value="Monky">Monky

    <input type="radio" name="animal" value="Cat">Cat

    <input type="radio" name="animal" value="Horse">Horse

    <input type="submit" value="선택">

</form>



출처: http://releasenote.tistory.com/36 [Release Note]