Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> JavaScript

jQuery में बटन क्लिक पर मल्टीपल चेकबॉक्स अनसिलेक्ट कैसे करें?

उदाहरण

jQuery toggleClass() और prop() से सभी चेकबॉक्स सिलेक्ट/अनसिलेक्ट करें।

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="UTF-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<title>Document</title> 
<style> 
    .changeColor { color: red; } 
</style> 
</head> 
<body> 
<input type="button" id="selectDemo" value="Want To Select All Values" /> 
<table> 
    <tr><td><input type="checkbox" id="CheckBoxId1" class="isSelected" /> Javascript</td></tr> 
    <tr><td><input type="checkbox" id="CheckBoxId2" class="isSelected" /> MySQL</td></tr> 
    <tr><td><input type="checkbox" id="CheckBoxId3" class="isSelected" /> MongoDB</td></tr> 
    <tr><td><input type="checkbox" id="CheckBoxId4" class="isSelected" /> Python</td></tr> 
</table> 
<script> 
    jQuery("#selectDemo").click(function() { 
        jQuery(this).toggleClass("changeColor"); 
        if (jQuery(this).hasClass("changeColor")) { 
            jQuery(".isSelected").prop("checked", true); 
            jQuery(this).val("Want To UnSelect All Values"); 
        } else { 
            jQuery(this).removeClass("changeColor"); 
            jQuery(".isSelected").prop("checked", false); 
            jQuery(this).val("Want To Select All Values"); 
        } 
    }); 
</script> 
</body> 
</html>

फ़ाइल सेव करें और Live Server से खोलें।

आउटपुट

बटन क्लिक करने पर सभी चेकबॉक्स टॉगल होंगे।

  1. jQuery का उपयोग करके चयनित चेकबॉक्स के मान प्राप्त करना jQuery का उपयोग करके चयनित चेकबॉक्स के मान प्राप्त करना

    हां, हम jQuery का उपयोग करके चयनित चेकबॉक्स के मान प्राप्त कर सकते हैं इनपुट की अवधारणा का उपयोग करके। हमें :checked सेलेक्टर का भी उपयोग करना होगा।उदाहरणकोड निम्न है:<!DOCTYPE html> <html lang=en> <head>    <meta charset=UTF-8>    <meta name=viewport c

  1. Android में बटन क्लिक पर नई एक्टिविटी कैसे शुरू करें Android में बटन क्लिक पर नई एक्टिविटी कैसे शुरू करें

    परिचयएंड्रॉइड में एक एक्टिविटी से दूसरी एक्टिविटी पर जाने के लिए `Intent` का उपयोग किया जाता है। यह लेख बटन क्लिक पर नई एक्टिविटी शुरू करने का बुनियादी उदाहरण दिखाता है।कार्यान्वयनचरण 1: लेआउट (activity_main.xml)<Button android:id=@+id/button android:layout_width=wrap_content andro

  1. Tkinter में बटन क्लिक इवेंट को कैसे हैंडल करें? Tkinter में बटन क्लिक इवेंट को कैसे हैंडल करें?

    कभी-कभी, Tkinter एप्लिकेशन में इवेंट हैंडल करना हमारे लिए एक कठिन कार्य बन सकता है। हमें उस एक्शन और इवेंट को मैनेज करना होता है जिसे एप्लिकेशन चलाते समय निष्पादित करने की आवश्यकता होती है। Button विजेट ऐसे इवेंट को हैंडल करने के लिए उपयोगी होता है। हम कॉलबैक को कमांड में पास करके Button विजेट का उप