자동으로 접을 수있는 블록 접기

Question

사이트를 조금 둘러 보았지만 이에 대한 완전한 대답을 찾지 못했습니다.하지만 if 문을 사용하여 접을 수있는 블록을 자동으로 접는 방법은 무엇입니까? 이것은 현재 나와있는 if 문의 일부입니다.

$(document).ready(function() { 

    $("#testRun").click(function(){ 

    alert("start"); 
    var output = ""; 

    var num1 = ""; 
    var num2 = ""; 
    var num3 = ""; 
    var num4 = ""; 
    var num5 = ""; 
    var countnum4 = 0; 
    var countnum5 = 0; 

    if($('#radio1').is(':checked')) 
    { 
     num1 = "First Number "; 
     $('#blockId').trigger('collapse'); 
    } 
    else if($('#radio2').is(':checked')) 
    { 
     num1 = "Second Number"; 
    } 
    else if($('#radio3').is(':checked')) 
    { 
     num1 = "Third"; 
    } 
    else if($('#radio4').is(':checked')) 
    { 
     num1 = "Fourth"; 
    } 
    else if($('#radio5').is(':checked')) 
    { 
     num1 = "Fifth"; 
    } 
    else if($('#radio6').is(':checked')) 
    { 
     num1 = "Sixth"; 
    } 
    else 
     num1 = "No numbers selected"//If else for num1 selection 


    output = "Your order has been sent. Here are the details of what you ordered" 
      + "<br />Number 1: " + num1 
      + "<br />Number 2: " + num2 
      + "<br />Number 3: " + num3 
      + "<br />Number 4: " + num4 
      + "<br />Number 5: " + num5; 

    $('#show').html(output); 

}); 
}); 

사람이 라디오 버튼을 탭하면 블록이 무너지면서 새로운 블록이 열리겠습니다. 이벤트 리스너와 관련이 있을지는 모르지만 구현 방법을 모르겠습니다. 편집 : 현재 내가하고있는 것을 더 쉽게 이해할 수 있도록하기 위해 대부분의 코드를 추가했습니다. 아래는 해당 접을 수있는 블록입니다

<div data-role="collapsible-set" id="blockId"> 
     <div data-role="collapsible" data-collapsed="false" > 
      <h3>Numbers</h3> 
      <div data-role="fieldcontain"> 
      <fieldset data-role="controlgroup"> 
       <legend>Option</legend> 
       <input type="radio" name="radio" id="radio1" value="" /> 
       <label for="radio1">First Number</label> 
       <input type="radio" name="radio" id="radio2" value="" /> 
       <label for="radio2">Second Number</label> 
       <input type="radio" name="radio" id="radio3" value="" /> 
       <label for="radio3">Third Number</label> 
       <input type="radio" name="radio" id="radio4" value="" /> 
       <label for="radio4">Fourth Number</label> 
       <input type="radio" name="radio" id="radio5" value="" /> 
       <label for="radio5">Fifth Number</label> 
       <input type="radio" name="radio" id="radio6" value="" /> 
       <label for="radio6">Sixth Number</label> 
      </fieldset> 
      </div> 
     </div> 
     </div> 

도움이 되길 바랍니다.

Answer 1

이것은 load 이벤트의 처리기입니다. 내부에는 #radio에 대한 change 처리기가 정의되어 있습니다. 그 안에는 당신이 우리와 공유 한 코드를 사용했습니다. $(this)은 radio 요소의 change 처리기 내부에서 사용되므로 radio 요소입니다. 이 시점에서 num1이 존재해야합니다.

$(function() { 
    $('#radio1').change(function() { 
     if($(this).is(':checked')) { 
      num1 = "First Number"; 
      $('#blockID').trigger('collapse'); 
     } 
    }); 
});