jQuery $ ("# रेडियोबटन")। परिवर्तन (…) डे-चयन के दौरान फायरिंग नहीं

Question

लगभग एक महीने पहले मिट का सवाल अनुत्तरित हो गया। दुख की बात है कि मैं अब उसी स्थिति में हूं।

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>

Comments

आपका वर्तमान कोड केवल रेडियो बटन में परिवर्तन के साथ सुनेगाid=r1

— Rafay

अगर id = r2 चुना गया है, तो id = r1 को डी-सेलेक्ट किया जाना चाहिए? रेडियो बटन का चयन इसके द्वारा कैप्चर नहीं किया गया है?

— मारवाड़

chk यह हो सकता है कि यह jsfiddle.net/aqZgs

— Rafay

निष्कासन का उपयोग न करें ('अक्षम'), राज्य बदलने के लिए प्रोप () का उपयोग करें, मेरा उत्तर देखें ।

— बेसिक

Answer 1

ऐसा लगता है कि change()फ़ंक्शन केवल तभी कहा जाता है जब आप एक रेडियो बटन की जांच करते हैं, न कि जब आप इसे अनचेक करते हैं। इसका उपयोग मैंने हर रेडियो बटन में परिवर्तन घटना को बांधने के लिए किया है:

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

या आप सभी रेडियो बटन को एक ही नाम दे सकते हैं:

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

यहाँ एक कार्यशील jsfiddle उदाहरण (क्रिस पोर्टर की टिप्पणी से अपडेट किया गया है।)

@ रे की टिप्पणी के अनुसार, आपको .उनके साथ नामों का उपयोग करने से बचना चाहिए । वे नाम jQuery 1.7.2 में काम करते हैं लेकिन अन्य संस्करणों में नहीं ( jsfiddle उदाहरण। )।

Comments

JsFiddle समाधान jQuery के बजाय Mootools पर सेट किया गया है और इसे कार्य करने से रोकता है। व्यवहार को देखने के लिए इस समाधान का प्रयास करें: jsfiddle.net/N9tBx । मैंने परिवर्तनों का एक लॉग जोड़ा और आप आसानी से देख सकते हैं कि चेक किए गए रेडियो बटन के अनचेक किए जाने पर परिवर्तन ईवेंट को निकाल नहीं दिया गया है।

— क्रिस पोर्टर

इनपुट "[name = someRadioGroup]" सिंटैक्स गलत है। सही सिंटैक्स है: "इनपुट [नाम = someRadioGroup]: रेडियो"। यह भी ध्यान देने योग्य है कि यह विधि केवल JQuery के संस्करण 1.7.2 में काम करती है। इसके लिए एक बग जमा किया गया है। देखें: jsfiddle.net/zn7q2/2 इस बग के एक उदाहरण के लिए यदि आप उत्सुक हैं।

— रे

@ रे: बग केवल उन में डॉट वाले नामों के लिए होता है। डॉट के बिना यह ठीक काम करता है, देखें jsfiddle.net/zn7q2/4

— एंडोमर

यदि आप "इनपुट [नाम = 'DateSearchOptions.Test']" (एकल कोट्स के बीच संलग्न नाम): jsfiddle.net/4hTxn

— Nullpo

कोड "if ($ (" # myCheckbox ")। Attr (" check "))" मेरे लिए काम नहीं किया, मुझे "($ (" # myCheckbox ") का उपयोग करना पड़ा है। (": check ")) ) "।

— बर्थो बर्नसमैन

Answer 2

<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'/>                  

जक्वेरी भाग

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

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

यहाँ डेमो है

Comments

यह एक दूसरे के विपरीत काम करता है जिसे सही के रूप में चिह्नित किया गया है: एस

— विलियम कॉन्टेबेल

+1। एंडोमर के समाधान ने काम किया लेकिन यह मेरे लिए अधिक मायने रखता है। वर्ग चयनकर्ता का उपयोग करने से फ़ंक्शन को बदलने से रोकता है यदि प्रपत्र बदलता है या खेतों की एक गतिशील संख्या होती है। नेक्रो वोट के लिए याय! (हालांकि अब 2 साल बाद jQuery के प्रोप () के बजाय attr () का उपयोग करने की सलाह देते हैं। api.jquery.com/prop )

— ट्रैविस

बदलना चाहिए .attr('checked')करने के लिए .prop('checked')।

— जस्टिन

खराब उदाहरण, यह नहीं है कि यह कैसे किया जाता है। तत्वों को अक्षम करने के लिए मेरा दूसरा जवाब देखें (विशेषताओं को हटाना गलत है) ।

— बेसिक 6

Answer 3

आप एक ही बार में सभी रेडियो बटन को नाम से बाँध सकते हैं:

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

यहाँ काम कर उदाहरण: http://jsfiddle.net/Ey4fa/

Comments

इस पर एक भिन्नता $ है ("फॉर्म इनपुट: रेडियो")। परिवर्तन (...); और विशिष्ट रेडियो बटन स्थिति प्रोप ('जाँच') का परीक्षण करें। ASP.NET में डायनामिक RadioButtonList का उपयोग करते समय यह बहुत उपयोगी है।

— टेरेंस गोला

Answer 4

यह आम तौर पर मेरे लिए काम करता है:

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

Answer 5

मेरी समस्या समान थी और यह मेरे लिए काम करती थी:

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

Answer 6

मान लीजिए कि उन रेडियो बटन के अंदर एक divआईडी है radioButtonsऔर रेडियो बटन का एक ही नाम है (उदाहरण के लिए commonName):

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

Answer 7

changeविचलन पर गोलीबारी नहीं करने की घटना वांछित व्यवहार है। आपको केवल एकल रेडियो बटन के बजाय पूरे रेडियो समूह पर एक चयनकर्ता चलाना चाहिए। और आपके रेडियो समूह का एक ही नाम होना चाहिए (विभिन्न मूल्यों के साथ)

निम्नलिखित कोड पर विचार करें:

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

जब आपके पास एक विशेष रेडियो बटन का चयन होता है तो इनपुट बॉक्स दिखाने के लिए मेरे पास एक ही उपयोग का मामला होता है। यदि ई-चयन पर भी घटना को निकाल दिया गया, तो मुझे हर बार 2 कार्यक्रम मिलेंगे।

Answer 8

यहाँ एक ही समस्या, यह ठीक काम किया:

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

Answer 9

अजाक्स के साथ, मेरे लिए काम किया:

एचटीएमएल:

<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>

जावास्क्रिप्ट:

 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();
                  }
              }  

और 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> ";

Comments

यह ओपी मूल प्रश्न का उत्तर नहीं देता है। आप यहां jQuery का उपयोग नहीं कर रहे हैं, और आप जावास्क्रिप्ट का उपयोग चेकिंग लॉजिक को संभालने के लिए कर रहे हैं, जावास्क्रिप्ट को नहीं।

— एलेक्स मूलचिनॉक