jQuery $ ("# রেডিওবাটন")। পরিবর্তন (…) ডি-সিলেকশন চলাকালীন গুলি চালানো হচ্ছে না


172

প্রায় এক মাস আগে মিটের প্রশ্নটি উত্তরহীন হয়েছিল। দুঃখের বিষয়, আমি এখন একই পরিস্থিতিতে চলেছি।

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>

আপনার বর্তমান কোডটি কেবল রেডিও বোতামের পরিবর্তনের সাথে শুনবেid=r1
রাফায়

1
যদি id = r2 নির্বাচিত হয়, id = r1 ডি-সিলেক্ট করা উচিত? একটি রেডিও বোতাম ডি-সিলেকশন কি এগুলি ক্যাপচার করেনি?
এন্টারওয়ারপস


অপসারণ ('অক্ষম') ব্যবহার করবেন না, রাষ্ট্র পরিবর্তন করতে প্রপ () ব্যবহার করুন, আমার উত্তর দেখুন
বেসিক

উত্তর:


311

দেখে মনে হচ্ছে যে change()ফাংশনটি কেবল তখনই বলা হয় যখন আপনি কোনও রেডিও বোতামটি পরীক্ষা করেন, যখন আপনি এটিটি চেক করেন না not আমি যে সমাধানটি ব্যবহার করেছি তা হ'ল পরিবর্তনের ইভেন্টটি প্রতিটি রেডিও বোতামে আবদ্ধ করা:

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

অথবা আপনি সমস্ত রেডিও বোতাম একই নাম দিতে পারেন:

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

এখানে একটি কার্যনির্বাহী জিসফিল উদাহরণ (ক্রিস পোর্টারের মন্তব্য থেকে আপডেট)

@ রায়ের মন্তব্যে, আপনার সাথে নাম ব্যবহার করা এড়ানো উচিত .। এই নামগুলি jQuery 1.7.2 এ কাজ করে তবে অন্যান্য সংস্করণগুলিতে নয় ( jsfiddle উদাহরণ ))।


JsFizz সমাধান jQuery এর পরিবর্তে Moolools এ সেট করা হয়েছে এবং এটি কার্যকরীকরণ থেকে বাধা দেয়। আচরণটি দেখার জন্য এই সমাধানটি ব্যবহার করে দেখুন: jsfiddle.net/N9tBx । আমি পরিবর্তনগুলির একটি লগ যুক্ত করেছি এবং আপনি সহজেই দেখতে পাচ্ছেন যে অন্যটি চেক করার সাথে সাথে চেক করা রেডিও বোতামটি চেক করা না থাকলে পরিবর্তন ইভেন্টটি বরখাস্ত করা হয় না।
ক্রিস পোর্টার

3
"[নাম = কিছু রেডিওগ্রুপ]" সিনট্যাক্স ইনপুটটি ভুল। সঠিক বাক্য গঠন: "ইনপুট [নাম = কিছু রেডিও গ্রুপ]: রেডিও"। আরও লক্ষণীয় যে এই পদ্ধতিটি কেবল JQuery এর 1.7.2 সংস্করণে কাজ করে। এর জন্য একটি বাগ জমা দেওয়া হয়েছে। যদি আপনি কৌতূহলী হন তবে এই বাগের উদাহরণের জন্য jsfiddle.net/zn7q2/2 দেখুন:
রায়

@ রায়: বাগটি কেবলমাত্র বিন্দুযুক্ত নামের জন্যই ঘটে। বিন্দু ছাড়া এটি সূক্ষ্মভাবে কাজ করে, jsfiddle.net/zn7q2/4 দেখুন
আন্দোমার

1
উদাহরণটি বিন্দুগুলির সাথে কাজ করে যদি আপনি "ইনপুট [নাম = 'তারিখ অনুসন্ধানের বিকল্পগুলি। টেস্ট']" (একক উদ্ধৃতিগুলির মধ্যে আবদ্ধ নাম): jsfiddle.net/4hTxn
নলপো

কোড "যদি ($ (" # আমারচেকবক্স "))। অ্যাট্রি (" চেক করা "))" আমার পক্ষে কাজ হয়নি, আমাকে "যদি ($ (" # আমারচেকবক্স ")) ব্যবহার করতে হয়েছিল। (": চেক করা হয়েছে ") ) "।
বার্থো বার্নসম্যান

35
<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');
        }
                    });

এখানে ডেমো


এইটি অন্যটিগুলির মতো নয় যা সঠিক হিসাবে চিহ্নিত হয়েছে: এস
উইলিয়াম কনটেস্টাবিল

+1 টি। আন্দোমারের সমাধান কাজ করেছিল তবে এটি আমার কাছে আরও বোধগম্য। শ্রেণি নির্বাচক ব্যবহার করে ফর্মটি পরিবর্তন করতে বা ফর্মের একটি গতিশীল সংখ্যার ক্ষেত্র থাকলে ফাংশন পরিবর্তন করতে বাধা দেয়। হ্যাঁ নেক্রো ভোটের জন্য! (যদিও এখন 2 বছর পরে, jQuery ঠেকনা ব্যবহার বিশেষ পরামর্শ দেওয়া হচ্ছে (ATTR পরিবর্তে) ()। api.jquery.com/prop )
ট্রাভিস

8
পরিবর্তন .attr('checked')করা উচিত .prop('checked')
জাস্টিন


22

আপনি নাম হিসাবে একবারে সমস্ত রেডিও বোতামে আবদ্ধ করতে পারেন:

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

এখানে কাজের উদাহরণ: http://jsfiddle.net/Ey4fa/


এর মধ্যে একটি প্রকরণ হ'ল "(" ফর্ম ইনপুট: রেডিও ") change পরিবর্তন (...); এবং নির্দিষ্ট রেডিও বোতাম শর্ত সাপটি পরীক্ষা করুন ('পরীক্ষিত')। এএসপি.নেটে একটি গতিশীল রেডিওবটনলিস্ট ব্যবহার করার সময় এটি খুব দরকারী।
টেরেন্স গোল্লা

5

এটি সাধারণত আমার পক্ষে কাজ করে:

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



0

আসুন আমরা বলি যে এই রেডিও বোতামগুলির divমধ্যে আইডি রয়েছে radioButtonsএবং রেডিও বোতামগুলির একই নাম থাকে (উদাহরণস্বরূপ commonName) তারপরে:

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

0

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

আমার আপনার যেমন ব্যবহারের কেস রয়েছে যেমন কোনও নির্দিষ্ট রেডিও বোতামটি নির্বাচন করা হয় তখন একটি ইনপুট বাক্সটি দেখানোর জন্য। ইভেন্টটিও ডি-সিলেকশনে চালিত হয়ে গেলে, আমি প্রতিবার ২ টি ইভেন্ট পেয়ে যাব।



-1

আমার সাথে কাজ করেছেন এজাক্স সহ:

এইচটিএমএল:

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

এবং পিএইচপি:

//// 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> ";

এটি ওপিএসের মূল প্রশ্নের উত্তর দেয় না। আপনি এখানে jQuery ব্যবহার করছেন না, এবং আপনি জাভাস্ক্রিপ্ট নয়, চেকিং যুক্তি পরিচালনা করতে পিএইচপি ব্যবহার করছেন।
অ্যালেক্স মুলচিনক
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.