선택 해제 중 jQuery $ (“# radioButton”). change (…)가 실행되지 않음

선택 해제 중 jQuery $ (“# radioButton”). change (…)가 실행되지 않음

---

한 달 전에 Mitt의 질문에 답이 없었습니다. 슬프게도, 나는 지금 같은 상황에 처해 있습니다.

http://api.jquery.com/change/#comment-133939395

상황은 다음과 같습니다. jQuery를 사용하여 라디오 버튼의 변경 사항을 캡처하고 있습니다. 라디오 버튼을 선택하면 편집 상자가 활성화됩니다. 라디오 버튼을 선택 해제하면 편집 상자를 비활성화하고 싶습니다.

활성화가 가능합니다. 그룹에서 다른 라디오 버튼을 선택하면 change이벤트가 시작 되지 않습니다 . 누구든지 이것을 고치는 방법을 알고 있습니까?

<input type="radio" id="r1" name="someRadioGroup"/> 

<script type="text/javascript">
    $("#r1").change(function () {
        if ($("#r1").attr("checked")) {
            $('#r1edit:input').removeAttr('disabled');
        }
        else {
            $('#r1edit:input').attr('disabled', true);
        }
    });
</script>

---

등 외모 change()당신은 당신이 선택을 취소하지 않을 경우, 라디오 버튼을 체크하면 기능 만이라고합니다. 내가 사용한 솔루션은 변경 이벤트를 모든 라디오 버튼에 바인딩하는 것입니다.

$("#r1, #r2, #r3").change(function () {

또는 모든 라디오 버튼에 동일한 이름을 지정할 수 있습니다.

$("input[name=someRadioGroup]:radio").change(function () {

다음은 작동하는 jsfiddle 예제입니다 (Chris Porter의 의견에서 업데이트되었습니다).

@Ray의 의견 .에 따라 그 안에 이름을 사용하지 않아야 합니다. 이러한 이름은 jQuery 1.7.2에서 작동하지만 다른 버전에서는 작동하지 않습니다 ( jsfiddle 예제 ).

---

<input id='r1' type='radio' class='rg' name="asdf"/>
<input id='r2' type='radio' class='rg' name="asdf"/>
<input id='r3' type='radio' class='rg' name="asdf"/>
<input id='r4' type='radio' class='rg' name="asdf"/><br/>
<input type='text' id='r1edit'/>                  

jquery 부분

$(".rg").change(function () {

if ($("#r1").attr("checked")) {
            $('#r1edit:input').removeAttr('disabled');
        }
        else {
            $('#r1edit:input').attr('disabled', 'disabled');
        }
                    });

여기 데모가 있습니다

---

이름별로 모든 라디오 버튼을 한 번에 바인딩 할 수 있습니다.

$('input[name=someRadioGroup]:radio').change(...);

실제 예제 : http://jsfiddle.net/Ey4fa/

---

이것은 일반적으로 나를 위해 작동합니다 :

if ($("#r1").is(":checked")) {}

---

내 문제는 비슷했고 이것은 나를 위해 일했다 :

$('body').on('change', '.radioClassNameHere', function() { ...

---

해당 라디오 버튼이 divID를 가진 안에 있고 radioButtons라디오 버튼의 이름이 같다고 가정 해 봅시다 commonName.

$('#radioButtons').on('change', 'input[name=commonName]:radio', function (e) {
    console.log('You have changed the selected radio button!');
});

---

The change event not firing on deselection is the desired behaviour. You should run a selector over the entire radio group rather than just the single radio button. And your radio group should have the same name (with different values)

Consider the following code:

$('input[name="job[video_need]"]').on('change', function () {
    var value;
    if ($(this).val() == 'none') {
        value = 'hide';
    } else {
        value = 'show';
    }
    $('#video-script-collapse').collapse(value);
});

I have same use case as yours i.e. to show an input box when a particular radio button is selected. If the event was fired on de-selection as well, I would get 2 events each time.

---

Same problem here, this worked just fine:

$('input[name="someRadioGroup"]').change(function() {
    $('#r1edit:input').prop('disabled', !$("#r1").is(':checked'));
});

---

With Ajax, for me worked:

Html:

<div id='anID'>
 <form name="nameOfForm">
            <p><b>Your headline</b></p>
            <input type='radio' name='nameOfRadio' value='seed' 
             <?php if ($interviewStage == 'seed') {echo" checked ";}?> 
            onchange='funcInterviewStage()'><label>Your label</label><br>
 </form>
</div>

Javascript:

 function funcInterviewStage() {

                var dis = document.nameOfForm.nameOfRadio.value;

                //Auswahltafel anzeigen
                  if (dis == "") {
                      document.getElementById("anID").innerHTML = "";
                      return;
                  } else { 
                      if (window.XMLHttpRequest) {
                          // code for IE7+, Firefox, Chrome, Opera, Safari
                          xmlhttp = new XMLHttpRequest();
                      } else {
                          // code for IE6, IE5
                          xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
                      }
                      xmlhttp.onreadystatechange = function() {
                          if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                              document.getElementById("anID").innerHTML = xmlhttp.responseText;
                          }
                      }
                      xmlhttp.open("GET","/includes/[name].php?id="+dis,true);
                      xmlhttp.send();
                  }
              }  

And php:

//// Get Value
$id = mysqli_real_escape_string($db, $_GET['id']);

//// Insert to database
$insert = mysqli_query($db, "UPDATE [TABLE] SET [column] = '$id' WHERE [...]");

//// Show radio buttons again
$mysqliAbfrage = mysqli_query($db, "SELECT [column] FROM [Table] WHERE [...]");
                  while ($row = mysqli_fetch_object($mysqliAbfrage)) {
                    ...
                  }
                  echo" 
                  <form name='nameOfForm'>
                      <p><b>Your headline</b></p>
                      <input type='radio' name='nameOfRadio' value='seed'"; if ($interviewStage == 'seed') {echo" checked ";} echo" onchange='funcInterviewStage()'><label>Yourr Label</label><br>
                      <input type='radio' name='nameOfRadio' value='startup'"; if ($interviewStage == 'startup') {echo" checked ";} echo" onchange='funcInterviewStage()'><label>Your label</label><br>

                  </form> ";

참고URL : https://stackoverflow.com/questions/5176803/jquery-radiobutton-change-not-firing-during-de-selection