jQuery চেকবক্স পরিবর্তন এবং ইভেন্ট ক্লিক করুন

Question

$(document).ready(function() {
  //set initial state.
  $('#textbox1').val($(this).is(':checked'));

  $('#checkbox1').change(function() {
    $('#textbox1').val($(this).is(':checked'));
  });

  $('#checkbox1').click(function() {
    if (!$(this).is(':checked')) {
      return confirm("Are you sure?");
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" id="checkbox1"/><br />
<input type="text" id="textbox1"/>

এখানে .change()চেকবক্সের স্থিতি সহ পাঠ্যবাক্সের মান আপডেট করে। আমি .click()আনচেক করার ক্রিয়াটি নিশ্চিত করতে ব্যবহার করি । যদি ব্যবহারকারী বাতিল নির্বাচন করে তবে চেকমার্কটি পুনরুদ্ধার করা হবে তবে.change() নিশ্চিতকরণের আগে গুলি চালায়।

এটি জিনিসগুলিকে অসঙ্গতিপূর্ণ অবস্থায় ফেলে দেয় এবং চেকবক্সটি চেক করা হলে পাঠ্যবক্সটি মিথ্যা বলে।

আমি কীভাবে বাতিলকরণের সাথে ডিল করতে পারি এবং পাঠ্যবক্সের মানটিকে চেকের রাজ্যের সাথে সামঞ্জস্য রাখতে পারি?

Comments

এটি এফএফ এবং ক্রোমে কাজ করে এবং আইই 8 তে এর ব্যাখ্যা করা আচরণ রয়েছে তাই আপনার কোন ব্রাউজারগুলিতে কাজ করতে এটি প্রয়োজন এবং কোনটি আপনি ত্রুটিটি দেখছেন তা লক্ষ্য করা গুরুত্বপূর্ণ।

— কাশদেগ

এটি সেরা নয়, তবে আমি বিশ্বাস করি এটি এখানে আমার জন্য কাজ করছে: http://jsfiddle.net/Skooljester/2Xxcn/ ।

— আইপ

Answer 1

জেএসফিডেলে পরীক্ষিত এবং আপনি যা যা চাইছেন তা করে a চেকবক্সের সাথে সম্পর্কিত কোনও লেবেল ক্লিক করা হলে এই পদ্ধতির গুলি চালানোর অতিরিক্ত সুবিধা রয়েছে।

আপডেট উত্তর:

$(document).ready(function() {
    //set initial state.
    $('#textbox1').val(this.checked);

    $('#checkbox1').change(function() {
        if(this.checked) {
            var returnVal = confirm("Are you sure?");
            $(this).prop("checked", returnVal);
        }
        $('#textbox1').val(this.checked);        
    });
});

আসল উত্তর:

$(document).ready(function() {
    //set initial state.
    $('#textbox1').val($(this).is(':checked'));

    $('#checkbox1').change(function() {
        if($(this).is(":checked")) {
            var returnVal = confirm("Are you sure?");
            $(this).attr("checked", returnVal);
        }
        $('#textbox1').val($(this).is(':checked'));        
    });
});

Comments

কেবল একটি নোট, এর this.checkedপরিবর্তে এটি ব্যবহার করা আরও দ্রুত $(this).is(':checked'): jsperf.com/prop-vs-ischecked/5

— ডাকোটা

@ ডাকোটা মঞ্জুর, এটি অনেক ধীর গতিযুক্ত, তবে আমরা এখনও k০০ ক অপারেশন / সেকেন্ডের জন্য কথা বলছি। সুতরাং, প্রতি মিলিসেকেন্ডে 600 বার। আমি মনে করি এটি যদি আপনার ওয়েব পৃষ্ঠায় পারফরম্যান্স সমস্যার কারণ হতে শুরু করে তবে আপনার জাভাস্ক্রিপ্টটি পুনরায় প্রকাশের প্রয়োজন হতে পারে;) কোড সহ পারফরম্যান্স মেট্রিকগুলি বোঝা ভাল। ধন্যবাদ।

— মাইক ইউ

@ মাইকইউ: অকালীন অপটিমাইজেশনের সাথে আপনার সাথে একমত, তবে this.checked+ দেশীয় জাভাস্ক্রিপ্ট লিখতে এটি আরও কম খাটো বিবেচনা করে সাধারণভাবে ব্যবহার করা উপযুক্ত হতে পারে (200 ডলার থেকে 300 গুণ বেশি দ্রুত হওয়া ছাড়া)।

— লেভাইট

আমি .attr () এর পরিবর্তে .prop () সুপারিশ করবো কারণ যেহেতু পরবর্তী ক্ষেত্রে সমস্ত ক্ষেত্রে কাজ হয় না এবং আমি বিশ্বাস করি যে jQuery .prop () এখনই সুপারিশ করে।

— কাবিদাশা

আমি মনে করি যে এটি [এটি] in ('# টেক্সটবক্স 1') এ রয়েছে val ভাল (this.checked); নথি বোঝায়। এটি $ ('# টেক্সটবক্স 1') হওয়া উচিত val (# ('# চেকবক্স 1')) is (': চেক করা'));

— ইউরিন

Answer 2

ডেমো

ব্যবহার mousedown

$('#checkbox1').mousedown(function() {
    if (!$(this).is(':checked')) {
        this.checked = confirm("Are you sure?");
        $(this).trigger("change");
    }
});

Comments

এটি যাচাই করার সময় এটি সতর্কতা প্রদর্শন করে এবং এটি সর্বদা আমাকে সত্যতা যাচাই করতে বাধা দেয়। এটি ক্রোমে রয়েছে।

— pimvdb

@Pimvdm হিসাবে একই। নিশ্চিতকরণটি চেক-অ্যাকশনের জন্যও পপ আপ হয় (এটি কেবল আনচেকের জন্য পপআপ করা উচিত) এবং ঠিক আছে বাছাইয়ের ফলে বাক্সটি চেক হয় না।

— অধ্যাপক বিশৃঙ্খলা

এটি মাউস ব্যবহার করার সময় কাজ করে, তবে আপনি এটি কীবোর্ড দিয়ে পরীক্ষা করে নিচ্ছেন না।

— ফ্রিনাক্স

@ ফ্রিনাক্স এটি খুব সহজ কারণ এটি একটি মাউস সম্পর্কিত প্রশ্ন। সম্পূর্ণ পৃথক ইস্যু সম্পর্কিত প্রাসঙ্গিকতার ভিত্তিতে দয়া করে উত্তরগুলি হ্রাস করবেন না। কীবোর্ডের মাধ্যমে চেকবক্স চেক করার পরে যদি আপনার সূচকের অবস্থাটি ট্রিগার করতে সমস্যা হয় তবে দয়া করে অযত্নে উত্তরগুলি বাদ দেওয়ার পরিবর্তে এ সম্পর্কে একটি প্রশ্ন পোস্ট করুন।

— জোসেফ মেরিকলে

মোউসডাউন যেহেতু কোনও ব্যবহারকারী চেকবাক্সের সাথে ইন্টারেক্ট করতে পারে কেবল তা নয় Down

— জোনাথন

Answer 3

আপনি যদি ব্যবহার করেন তবে বেশিরভাগ উত্তর এটিকে ধরবে না (সম্ভবত) <label for="cbId">cb name</label>। এর অর্থ আপনি যখন লেবেলে ক্লিক করবেন এটি সরাসরি চেকবক্সে ক্লিক করার পরিবর্তে বাক্সটি চেক করবে। (ঠিক প্রশ্ন নয়, বিভিন্ন অনুসন্ধান ফলাফল এখানে আসতে ঝোঁক)

<div id="OuterDivOrBody">
    <input type="checkbox" id="checkbox1" />
    <label for="checkbox1">Checkbox label</label>
    <br />
    <br />
    The confirm result:
    <input type="text" id="textbox1" />
</div>

কোন ক্ষেত্রে আপনি ব্যবহার করতে পারেন:

Earlier versions of jQuery:

$('#OuterDivOrBody').delegate('#checkbox1', 'change', function () {
    // From the other examples
    if (!this.checked) {
        var sure = confirm("Are you sure?");
        this.checked = !sure;
        $('#textbox1').val(sure.toString());
    }
});

JQuery 1.6.4 সহ জেএসফিডেল উদাহরণ

jQuery 1.7+

$('#checkbox1').on('change', function() { 
    // From the other examples
    if (!this.checked) {
        var sure = confirm("Are you sure?");
        this.checked = !sure;
        $('#textbox1').val(sure.toString());
    }
});

সর্বশেষতম jQuery 2.x সহ জেএসফিডাল উদাহরণ

• ক্লিকযোগ্য চেকবক্স লেবেলের সাথে যুক্ত জেএসফিডাল উদাহরণ এবং এইচটিএমএল

Comments

এটি # আউটারডাইভঅরবিডি নয়। আউটডাইভ ওরবডি :)

— লরেন্ট

Answer 4

ঠিক আছে .. শুধু মাথা ব্যথা বাঁচানোর জন্য (এটির মধ্যরাত এখানে), আমি এখানে আসতে পেরেছিলাম:

$('#checkbox1').click(function() {
  if (!$(this).is(':checked')) {
    var ans = confirm("Are you sure?");
     $('#textbox1').val(ans);
  }
});

আশা করি এটা সাহায্য করবে

Answer 5

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

$('#checkboxID').click(function () {
    if ($(this).attr('checked')) {
        alert('is checked');
    } else {
        alert('is not checked');
    }
})

Comments

একটি ওয়েব অনুসন্ধানের মাধ্যমে এটি জুড়ে এসেছিল। আপনার ' অ্যাটর

— ডাঃ

Answer 6

এই তুমি

এইচটিএমএল

<input id="ProductId_a183060c-1030-4037-ae57-0015be92da0e" type="checkbox" value="true">

জাভাস্ক্রিপ্ট

<script>
    $(document).ready(function () {

      $('input[id^="ProductId_"]').click(function () {

        if ($(this).prop('checked')) {
           // do what you need here     
           alert("Checked");
        }
        else {
           // do what you need here         
           alert("Unchecked");
        }
      });

  });
</script>

Answer 7

পরিবর্তন ইভেন্ট থেকে মুক্তি পান এবং পরিবর্তে ক্লিক ইভেন্টের পাঠ্যবক্সের মান পরিবর্তন করুন। কনফার্মের ফলাফলটি ফিরিয়ে দেওয়ার পরিবর্তে এটি কোনও ভারে ধরুন। যদি এটি সত্য হয় তবে মানটি পরিবর্তন করুন। তারপরে ভেরটি ফেরত দিন।

Answer 8

চেকবক্স ক্লিক করুন এবং একই ইভেন্টের লুপের মান পরীক্ষা করা সমস্যা।

এটা চেষ্টা কর:

$('#checkbox1').click(function() {
    var self = this;
    setTimeout(function() {

        if (!self.checked) {
            var ans = confirm("Are you sure?");
            self.checked = ans;
            $('#textbox1').val(ans.toString());
        }
    }, 0);
});

ডেমো: http://jsfiddle.net/mrchief/JsUWv/6/

Answer 9

আপনি যদি আইচেক জেকুরি ব্যবহার করছেন তবে নীচের কোডটি ব্যবহার করুন

 $("#CheckBoxId").on('ifChanged', function () {
                alert($(this).val());
            });

Answer 10

এটা চেষ্টা কর

$('#checkbox1').click(function() {
        if (!this.checked) {
            var sure = confirm("Are you sure?");
            this.checked = sure;
            $('#textbox1').val(sure.toString());
        }
    });

Answer 11

$(document).ready(function() {
    //set initial state.
    $('#textbox1').val($(this).is(':checked'));

    $('#checkbox1').change(function() {
        $('#textbox1').val($(this).is(':checked'));
    });

    $('#checkbox1').click(function() {
        if (!$(this).is(':checked')) {
            if(!confirm("Are you sure?"))
            {
                $("#checkbox1").prop("checked", true);
                $('#textbox1').val($(this).is(':checked'));
            }
        }
    });
});

Answer 12

// this works on all browsers.

$(document).ready(function() {
    //set initial state.
    $('#textbox1').val($(this).is(':checked'));

    $('#checkbox1').change(function(e) {
        this.checked =  $(this).is(":checked") && !!confirm("Are you sure?");
        $('#textbox1').val(this.checked);
        return true;
    });
});

Answer 13

$('#checkbox1').click(function() {
    if($(this).is(":checked")) {
        var returnVal = confirm("Are you sure?");
        $(this).attr("checked", returnVal);
    }
    $('#textbox1').val($(this).is(':checked')); 
});


<div id="check">
    <input type="checkbox" id="checkbox1" />
    <input type="text" id="textbox1" />
</div>

Answer 14

দেরীতে উত্তর, তবে আপনি এটি ব্যবহার করতে পারেন on("change")

$('#check').on('change', function() {
     var checked = this.checked
    $('span').html(checked.toString())
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" id="check" > <span>Check me!</span>

Answer 15

কেবলমাত্র ক্লিক ইভেন্টটি ব্যবহার করুন আমার চেক বাক্সের আইডি চেকআল

     $('#CheckAll').click(function () {

        if ($('#CheckAll').is(':checked') == true) {

             alert(";)");
      }
    }

Answer 16

নামে রেডিও মান পান

 $('input').on('className', function(event){
        console.log($(this).attr('name'));
        if($(this).attr('name') == "worker")
            {
                resetAll();                 
            }
    });

Answer 17

আমি নিশ্চিত নই যে সবাই কেন এতো জটিল করে তুলছে। এটাই আমি করেছি।

if(!$(this).is(":checked")){ console.log("on"); }

Answer 18

 $("#person_IsCurrentAddressSame").change(function ()
    {
        debugger
        if ($("#person_IsCurrentAddressSame").checked) {
            debugger

        }
        else {

        }

    })

Comments

কোড-কেবলমাত্র উত্তরগুলি নিম্ন মানের হিসাবে বিবেচিত হয়: আপনার কোডটি কী করে এবং কীভাবে এটি সমস্যার সমাধান করে তা একটি ব্যাখ্যা প্রদান নিশ্চিত করুন। আপনি যদি আপনার পোস্টে আরও তথ্য যুক্ত করতে পারেন তবে এটি প্রশ্নকারী এবং ভবিষ্যতের পাঠকদের উভয়কেই সহায়তা করবে। সম্পূর্ণ কোড-ভিত্তিক উত্তরগুলি ব্যাখ্যা করতেও দেখুন: meta.stackexchange.com/questions/114762/…

— borchvm