JQuery Checkbox 처리하기.

출처 : http://drupal.org/node/116548

HOWTO: Tell if a checkbox is checked

Drupal 5.x

Last modified: January 20, 2009 - 20:40

A simple way to tell if a checkbox has been checked using jQuery is with the :checked CSS "pseudo class." Your selector should use the following syntax:

$('#edit-checkbox-id:checked')

Obviously, you need to replace checkbox-id with the actual name of the form element. This will attempt to grab any checked checkbox with that ID. If none are found, the result set will be null. So, combining this with jQuery's .val() method, you can use the following conditional statement to execute code if a checkbox has been checked:

if ($('#edit-checkbox-id:checked').val() !== null) {
  // Insert code here.
}

(Note: the checkboxes element in the Forms API produces unique IDs for each option. View the source to see what I mean.)

‹ Trigger fields to be displayed up HOWTO: Toggle DIV visibility ›

» Login or register to post comments

The example can be simplified

nevets - May 22, 2007 - 14:06

If you want to only do something to elements that are selected as in this case (here we want to do something if the checkbox is checked) you can simplify the code to

$('#edit-checkbox-id:checked'),each(
  function() {
   // Insert code here
  }
);

and the function will only run if the checkbox with the selected id is checked.

If you use a selector that can return more than one element, the function is applied each of the matching elements (one at a time), so

$("input[@type=checkbox][@checked]").each(
  function() {
   // Insert code here
  }
);

will run the function for each checkbox that is checked.

Login or register to post comments

For jQuery 1.3

uzbekjon - May 13, 2009 - 11:08

Liked your second method that iterates though checked checkboxes. For those who are using drupal 7 with jQuery 1.3 the second method will look like this:

$("input[type=checkbox][checked]").each(
  function() {
   // Insert code here
  }
);

I had hard time with that code not working and then came accros this article on checking if checkbox is checked.

-------------------------------
Read Drupal tutorials & tips at Drupal HowTo Collection

Login or register to post comments

I couldn't get the method

tom friedhof - December 5, 2007 - 03:55

I couldn't get the method you mentioned to work in IE. The following jquery string will return a boolean in both firefox and IE:

$('#edit-checkbox-id').is(':checked');

Login or register to post comments

Another method

Keith Marran - December 5, 2007 - 14:38

Another method is to retrieve the "checked" attribute:

if ($('#checkbox').attr('checked')) {
     // do something
}

Login or register to post comments

jQuery 1.2.x

brettalton - September 23, 2008 - 16:06

Has something changed since jQuery 1.2.x?

I've tried:

// once, per page load
if ($('#edit-checkbox-id:checked').val() !== null)
{
alert('1');
}

// never
$('#edit-checkbox-id:checked').each(function()
{
alert('2');
}
);

// once, per checkbox that is already checked, per page load
$("input[@type=checkbox][@checked]").each(function()
{
alert('3');
}
);

//never
if ($('#edit-checkbox-id').is(':checked'))
{
alert('4');
}

//never
if ($('#edit-checkbox-id').attr('checked'))
{
alert('5');
}

and none of them work when I check '#edit-checkbox-id' ON.

Login or register to post comments

jQuery 1.2.x

cdale - September 24, 2008 - 04:06

I think you now need to use the following syntax, at least this works for me.

if ($('#edit-checkbox-id').is(':checked'))
{
  alert('1');
}

Login or register to post comments

I had to use !=, rather than

pingers - June 15, 2009 - 06:06

I had to use !=, rather than !==.