라디오가 체크되었을 때 클래스를 제거합니다.

Question

라디오가 체크 된 경우 버튼 책이 있습니다. 버튼 책에서 비활성화 된 모든 클래스가 제거되고 하나만 선택하면 버튼 책이 비활성화 된 상태로 유지됩니다.

나는 기능을했지만 작동하지 않으려 고 노력했다.

$(document).ready(function() { 
 
    var departInput = $('#flightResultOneway input:radio'); 
 
    var returnInput = $('#flightResultReturn input:radio'); 
 

 
    $(departInput).click(function() { 
 
    $('#flightResultOneway input:not(:checked)').parent().addClass('hide'); 
 
    $('#flightResultOneway input:checked').parent().removeClass('hide'); 
 
    }); 
 

 
    $(returnInput).click(function() { 
 
    $('#flightResultReturn input:not(:checked)').parent().addClass('hide'); 
 
    $('#flightResultReturn input:checked').parent().removeClass('hide'); 
 
    }); 
 
}); 
 

 
// BUTTON BOOK 
 
if($('#flightResultOneway input:checked')){ 
 
\t $('#book').removeClass('disabled'); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div id="flightResultOneway" class="list-result"> 
 
<h1>Depart</h1> 
 
    <div class="result-list"> 
 
    <label class="item"> 
 
     <input type="radio" name="depart">lion 
 
    </label> 
 
    <label class="item"> 
 
     <input type="radio" name="depart">citi 
 
    </label> 
 
    </div> 
 
</div> 
 
<div id="flightResultReturn" class="list-result"> 
 
<h1>Return</h1> 
 
    <div class="result-list"> 
 
    <label class="item"> 
 
     <input type="radio" name="return">citi 
 
    </label> 
 
    <label class="item"> 
 
     <input type="radio" name="return">lion 
 
    </label> 
 
    </div> 
 
</div> 
 

 
<div class="next-book"> 
 
    <a href="#" id="book" class="btn btn-primary disabled">book</a> 
 
</div>

Answer 1

는

$(document).on("change", "input[type='radio']", function(){ 
    $("input[type='radio']").each(function(){ 
    $("#book").attr("disabled", false); 
     if($(this).is(":checked") === false){ 
      $("#book").attr("disabled", true); 
     } 
    }); 
}); 

그리고 당신의 HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
<div id="flightResultOneway" class="list-result"> 
<h1>Depart</h1> 
    <div class="result-list"> 
    <label class="item"> 
     <input type="radio" name="depart">lion 
    </label> 
    <label class="item"> 
     <input type="radio" name="depart">citi 
    </label> 
    </div> 
</div> 
<div id="flightResultReturn" class="list-result"> 
<h1>Return</h1> 
    <div class="result-list"> 
    <label class="item"> 
     <input type="radio" name="return">citi 
    </label> 
    <label class="item"> 
     <input type="radio" name="return">lion 
    </label> 
    </div> 
</div> 

<div class="next-book"> 
    <a href="#" id="book" class="btn btn-primary disabled">book</a> 
</div>