>

각 질문에 4 가지 옵션이있는 MCQ 퀴즈 질문을하려고합니다. 각 질문에 대해 개별 재설정 버튼을 넣고 싶습니다. 재설정 버튼을 클릭하면 모든 라디오 버튼이 재설정되거나 선택 해제됩니다. 동일한 그룹 또는 이름의 라디오 버튼을 재설정하는 방법은 무엇입니까?

<div class="col-lg-10 col-md-10 col-sm-9">
                        <div class="lms_service_detail">
                            <h3>An object is represented by two attributes, out of which one is characteristics and the other one is ___________.</h3>
                            <p><input name="1" id="Radio1" type="radio" value="A" /> Behaviour</p>
                            <p><input name="1" id="Radio2" type="radio" value="B" /> Situation</p>
                            <p><input name="1" id="Radio3" type="radio" value="C" /> Abstraction</p>
                            <p><input name="1" id="Radio4" type="radio" value="D" /> Encapsulation</p>
                            <p><input id="Submit1" type="submit" value="Reset" /></p>
                        </div>
                    </div>
                    <div class="col-lg-10 col-md-10 col-sm-9">
                        <div class="lms_service_detail">
                            <h3>Name the programming technique that implements programs as an organized collection of interactive objects.</h3>
                            <p><input name="2" id="Radio5" type="radio" value="A" /> Procedural Programming</p>
                            <p><input name="2" id="Radio6" type="radio" value="B" /> Modular Programming</p>
                            <p><input name="2" id="Radio7" type="radio" value="C" /> Object-Oriented Programming</p>
                            <p><input name="2" id="Radio8" type="radio" value="D" /> None of these</p>
                            <p><input id="Submit2" type="submit" value="Reset" /></p>
                        </div>
                </div>

  • 답변 # 1

    function onResetClick() {
        var $firstQuestion = document.querySelectorAll('input[name=1]');
        var $secondQuestion = document.querySelectorAll('input[name=2]');
        for (var i = 0; i < $firstQuestion.length; i++) {
            var $el = $firstQuestion;
            $el.setAttribute('checked', false);
        }
        for (i = 0; i < $secondQuestion.length; i++) {
            $el = $secondQuestion;
            $el.setAttribute('checked', false);
        }
    }
    
    

    onResetClick 메서드를 바인딩하면 먼저 질문에 해당하는 모든 입력을 가져옵니다. 그런 다음 요소를 반복하고 setAttribute가 false로 확인되었습니다. jQuery가 필요하지 않습니다.

  • 답변 # 2

    JQuery에서는 다음을 사용할 수 있습니다.

    $('input[name=Choose]').attr('checked',false); //for a specific radio button
    OR
    $('input').attr('checked',false); //for all radio buttons
    
    

    그리고 JavaScript에서 :

    var ele = document.getElementsByName("Choose");
    ele.checked = false; //for specific element
    OR
    var inputs = document.getElementsByTagName('input');
    for(var i=0;i<inputs .length;i++)
      inputs [i].checked = false; //for all radio buttons
    
    

관련 자료

  • 이전 Swagger Codegen 기존 클래스 사용
  • 다음 Java 출력 응답이 너무 느림