কিভাবে একটি চেকবক্স jQuery চেক করা হয় কিনা তা পরীক্ষা করবেন?

আমি কিভাবে সফলভাবে সম্পত্তি চেক করতে পারি?

একটি চেকবাক্স DOM উপাদান checked সম্পত্তি আপনি উপাদান checked রাষ্ট্র দিতে হবে।

আপনার বিদ্যমান কোড দেওয়া, তাই আপনি এই কাজ করতে পারে:

if(document.getElementById('isAgeSelected').checked) {
    $("#txtAge").show();
} else {
    $("#txtAge").hide();
}

যাইহোক, toggle ব্যবহার করে এটি করার অনেক সুন্দর উপায় রয়েছে:

$('#isAgeSelected').click(function() {
    $("#txtAge").toggle(this.checked);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="isAgeSelected"/>
<div id="txtAge" style="display:none">Age is something</div>

JQuery 1.6 থেকে, jQuery.attr() এর আচরণ পরিবর্তিত হয়েছে এবং ব্যবহারকারীদের একটি উপাদান এর চেক হওয়া অবস্থায় পুনরুদ্ধার করতে এটি ব্যবহার না করার পরামর্শ দেওয়া হয়। পরিবর্তে, আপনি jQuery.prop() ব্যবহার করা উচিত:

$("#txtAge").toggle(
    $("#isAgeSelected").prop("checked") // For checked attribute it returns true/false;
                                        // Return value changes with checkbox state
);

দুটি অন্যান্য সম্ভাবনার হয়:

$("#txtAge").get(0).checked
$("#txtAge").is(":checked")

JQuery ব্যবহার করে 1.6

<input type="checkbox" value="1" name="checkMeOut" id="checkMeOut" checked="checked" />

// traditional attr
$('#checkMeOut').attr('checked'); // "checked"
// new property method
$('#checkMeOut').prop('checked'); // true

নতুন সম্পত্তি পদ্ধতি ব্যবহার করে:

if($('#checkMeOut').prop('checked')) {
    // something when checked
} else {
    // something else when not
}

আপনি এই কোড ব্যবহার করতে পারেন:

$('#isAgeSelected').click(function(){
   console.log(this.checked);
   if(this.checked == true) {
        $("#txtAge").show();
    } else {
       $("#txtAge").hide();
   }
});

আমি jQuery ছাড়া যে সঠিক একই জিনিস কিভাবে একটি উত্তর পোস্ট করার সিদ্ধান্ত নিয়েছে। শুধু কারণ আমি একটি বিদ্রোহী।

var ageCheckbox = document.getElementById('isAgeSelected');
var ageInput = document.getElementById('txtAge');

// Just because of IE <333
ageCheckbox.onchange = function() {
    // Check if the checkbox is checked, and show/hide the text field.
    ageInput.hidden = this.checked ? false : true;
};

প্রথমে আপনি তাদের আইডি দ্বারা উপাদান উভয় পেতে। তারপরে আপনি চেকবক্সের onchange ইভেন্টটি একটি ফাংশন বরাদ্দ করুন যা চেকবক্সটি চেক করে কিনা তা পরীক্ষা করে এবং উপযুক্তভাবে বয়স পাঠ্য ক্ষেত্রের hidden সম্পত্তি সেট করে। ত্রিনিরি অপারেটর ব্যবহার করে যে উদাহরণ।

আপনি এটি পরীক্ষা করার জন্য এখানে একটি fiddle ।

অভিযোজ্য বস্তু

যদি ক্রস ব্রাউজারের সামঞ্জস্য একটি সমস্যা হয় তবে আমি সিএসএস display সম্পত্তি সেটিকে কেউ এবং ইনলাইনে সেট করার প্রস্তাব করি।

elem.style.display = this.checked ? 'inline' : 'none';

ধীর কিন্তু ক্রস ব্রাউজার সামঞ্জস্যপূর্ণ।

আমি এই ব্যবহার করছি এবং এটি একেবারে সূক্ষ্ম কাজ করছে:

$("#checkkBoxId").attr("checked") ? alert("Checked") : alert("Unchecked");

দ্রষ্টব্য: যদি চেকবক্সটি চেক করা হয় তবে এটি অন্যথায় অনির্ধারিত সত্য ফিরে আসবে, তাই "সত্য" মানটির জন্য আরও ভালোভাবে পরীক্ষা করুন।

আমি এটা সহজ এক হতে হবে

$('#isAgeSelected').change(function() {
    if($(this).is(":checked")) {
        $('#txtAge').show();
    }
else{
        $('#txtAge').hide();
    }                                          
});

আমি বিশ্বাস করি তুমি এটা করতে পারো

if ($('#isAgeSelected :checked').size() > 0)
{
    $("#txtAge").show(); 
} else { 
    $("#txtAge").hide();
}

এই উদাহরণ বাটন জন্য।

নিম্নলিখিত চেষ্টা করুন:

<input type="button" class="check" id="checkall" value="Check All" />  &nbsp; <input type="button" id="remove" value="Delete" /> <br/>

<input type="checkbox" class="cb-element"  value="1" /> Checkbox  1 <br/>
<input type="checkbox" class="cb-element"  value="2" /> Checkbox  2 <br/>
<input type="checkbox" class="cb-element"  value="3" /> Checkbox  3 <br/>


$('#remove').attr('disabled', 'disabled'); 

$(document).ready(function() {  

    $('.cb-element').click(function() {

        if($(this).prop('checked'))
        {
            $('#remove').attr('disabled', false);
        }
        else
        {
            $('#remove').attr('disabled', true);
        }
    });   

    $('.check:button').click(function()
{
    var checked = !$(this).data('checked');
    $('input:checkbox').prop('checked', checked);
    $(this).data('checked', checked);

    if(checked == true)
    {
        $(this).val('Uncheck All');
         $('#remove').attr('disabled', false);
    }

    else if(checked == false)
    {
        $(this).val('Check All');
        $('#remove').attr('disabled', true);
    }
});
});

এই একই জিনিস করতে কিছু ভিন্ন পদ্ধতি:

$(document).ready(function (){

    $('#isAgeSelected').click(function() {
        // $("#txtAge").toggle(this.checked);

        // Using a pure CSS selector
        if ($(this.checked)) {
            alert('on check 1');
        };

        // Using jQuery's is() method
        if ($(this).is(':checked')) {
            alert('on checked 2');
        };

        //  // Using jQuery's filter() method
        if ($(this).filter(':checked')) {
            alert('on checked 3');
        };
    });
});

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<input type="checkbox" id="isAgeSelected"/>
<div id="txtAge" style="display:none">Age is something</div>

এটা আমার জন্য কাজ করেছে:

$get("isAgeSelected ").checked == true

যেখানে isAgeSelected করা হয় আইডি নিয়ন্ত্রণ।

এছাড়াও, @ karim79 এর answer জরিমানা কাজ করে। আমি এটা পরীক্ষার সময় আমি কি মিস ছিল তা নিশ্চিত নই।

নোট, এই উত্তরটি জাভাস্ক্রিপ্ট নয়, মাইক্রোসফ্ট অ্যাজাক্স ব্যবহার করে

এটা করার আমার উপায় হল:

if ( $("#checkbox:checked").length ) {       
    alert("checkbox is checked");
} else {
    alert("checkbox is not checked");
}

এটি আমার জন্য কাজ করে:

/* isAgeSelected being id for checkbox */

$("#isAgeSelected").click(function(){
  $(this).is(':checked') ? $("#txtAge").show() : $("#txtAge").hide();
});

চেকবক্স সম্পত্তিটির জন্য Click ইভেন্ট হ্যান্ডলারটি ব্যবহার করা অবিশ্বস্ত, কারণ checked সম্পত্তি ইভেন্ট হ্যান্ডলার নিজেই কার্যকর হওয়ার সময় পরিবর্তন করতে পারে!

আদর্শভাবে, আপনি আপনার কোডটিকে change ইভেন্ট হ্যান্ডলারের মধ্যে রাখতে change যেমন এটি চেক বক্সের মান পরিবর্তিত হওয়ার সময় প্রতিটি সময় বহিস্কার করা হয় (এটি কীভাবে করা হয় তার থেকে স্বাধীন)।

$('#isAgeSelected').bind('change', function () {

   if ($(this).is(':checked'))
     $("#txtAge").show();
   else
     $("#txtAge").hide();
});

তুমি ব্যবহার করতে পার:

  if(document.getElementById('isAgeSelected').checked)
    $("#txtAge").show();  
  else
    $("#txtAge").hide();

if($("#isAgeSelected").is(':checked'))
  $("#txtAge").show();  
else
  $("#txtAge").hide();

তাদের উভয় কাজ করা উচিত।

ব্যবহার করুন:

<input type="checkbox" name="planned_checked" checked id="planned_checked"> Planned

$("#planned_checked").change(function() {
    if($(this).prop('checked')) {
        alert("Checked Box Selected");
    } else {
        alert("Checked Box deselect");
    }
});

    $("#planned_checked").change(function() {
        if($(this).prop('checked')) {
            alert("Checked Box Selected");
        } else {
            alert("Checked Box deselect");
        }
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="checkbox" name="planned_checked" checked id="planned_checked"> Planned

শীর্ষ উত্তর আমার জন্য এটা না। যদিও এটি ছিল:

<script type="text/javascript">
    $(document).ready(function(){

        $("#li_13").click(function(){
            if($("#agree").attr('checked')){
                $("#saveForm").fadeIn();
            }
            else
            {
                $("#saveForm").fadeOut();
            }
        });
    });
</script>

মূলত যখন এলিমেন্টটি # li_13 ক্লিক করা হয়, এটি পরীক্ষা করে যে # element (যা চেকবাক্স) সম্মত হয় তা .attr('checked') ফাংশন ব্যবহার করে চেক করা হয় কিনা তা পরীক্ষা করে। যদি এটি # শেভফর্ম উপাদানের মধ্যে ফেইড হয়, এবং যদি সংরক্ষণ ফরম উপাদানটি fadeOut না হয়।

1) আপনার এইচটিএমএল মার্কআপ যদি হয়:

<input type="checkbox"  />

Attr ব্যবহৃত:

$(element).attr("checked"); // Will give you undefined as initial value of checkbox is not set

যদি প্রপ ব্যবহৃত হয়:

$(element).prop("checked"); // Will give you false whether or not initial value is set

2) আপনার এইচটিএমএল মার্কআপ যদি হয়:

 <input type="checkbox"  checked="checked" />// May be like this also  checked="true"

Attr ব্যবহৃত:

$(element).attr("checked") // Will return checked whether it is checked="true"

প্রস্তাব ব্যবহৃত:

$(element).prop("checked") // Will return true whether checked="checked"

$(document).ready(function() {    
    $('#agecheckbox').click(function() {
        if($(this).is(":checked"))
        {
            $('#agetextbox').show();
        } else {
            $('#agetextbox').hide();
        }
    });
});

$(selector).attr('checked') !== undefined

যদি ইনপুটটি চেক করা হয় এবং এটি না থাকে তবে মিথ্যাটি true ।