All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

Set Checkbox Checked jQuery

Last Updated : Mar 11, 2024

Set Checkbox Checked jQuery

In this article we will show you the solution of set checkbox checked jQuery, a compact "write less, do more" JavaScript library is called jQuery. JavaScript in your website may now be used much more easily thanks to jQuery.

Many basic actions that are often accomplished by writing numerous lines of JavaScript code are wrapped in jQuery's methods so that you just need to write one line of code to use them.

Users can choose one or more alternatives from a small number of options by using the checkboxes.

Step By Step Guide On Set Checkbox Checked jQuery :-

<!DOCTYPE html>
<html>
<head>
  <title>jQuery Example</title>
  <style>
  b {
     color: green;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<input id="checkbox1" type="checkbox" checked="checked">
<label for="checkbox1">TalkersCode check/ Uncheck this checkbox</label>
<p></p>
<script>
$( "input" ).change(function() {
  var $input = $(this );
  $( "p" ).html(
    ".attr( \"checked\" ): <b>" + $input.attr( "checked" ) + "</b><br>" +
    ".prop( \"checked\" ): <b>" + $input.prop( "checked" ) + "</b><br>" +
    ".is( \":checked\" ): <b>" + $input.is( ":checked" ) + "</b>" );
}).change();
</script>
</body>
</html>
  1. The first step is to write <HTML>, which tells the browser what version of HTML we're using. A tag is the first element of an HTML document.
  2. Use the <head> tag to describe the project's heading. In contrast to the final brackets, which are closed, the title and final brackets both are open. External style sheets, also known as step-by-step style sheets, appear on a webpage based on the URL or path.
  3. Next, we create the font size and weight in style.
  4. Then we style by closing our eyes.
  5. The <script> tag was then added. The script tag also includes the javascript google API run or an explanation of the code or file we used.
  6. The script is then closed.
  7. The <body> tag, which describes the webpage's body, is then placed after this. This is where the website's content is written.
  8. Then we create checkboxes for the program.
  9. After that again we opened the <script> tag and then added. The script tag also includes the javascript google API run or an explanation of the code or file we used.
  10. After that we close </script></body></html>

Conclusion :-

An input tag for HTML elements allows for the creation of checkboxes. The 'type' element of the input tag accepts a variety of sorts, including radio, checkbox, text, phone, email, etc.

So, we can add a checkbox field to our document by assigning the "type" property to "checkbox".

I hope this article on set checkbox checked jQuery helps you and the steps and method mentioned above are easy to follow and implement.

Author Image About Amruta

Amruta is an Experienced web developer with 4 years for experience she completed her master's with MCA and passionate about programming Languages for creating technical contents like HTML, CSS, JavaScript, Java, Python, PHP, jQuery.

Follow Amruta On Linkedin 🡪