Grow your CSS skills. Land your dream job.

jQuery / :checkbox / :checked

  • # June 15, 2009 at 11:27 pm

    Hello all,

    I am hoping one of the gurus here will be able to give me a hand with a piece of jQuery I am trying to write.

    I have a form which has a series of 20 checkboxes or so. When a box is checked I would like that value to be displayed else where on the screen (some div). If the box is unchecked, I would like that value to be removed from that div.

    I didn’t get very far…I am still in the process of learning the barely more advance functions of jQuery.

    Code:
    $(“form#explore input:checkbox”).click(doSomething);

    But, after that…it gets a bit sketchy/embarrassing.

    I guess the next thing I will want to know is if the box is checked or not…if it was not checked, write the value to some div, and if it is already checked, remove that value from the div. But, I don’t know how to get to there. :/

    Any help will be greatly appreciated!

    # June 16, 2009 at 5:34 pm

    Here’s what I came up with (there’s probably a WAY better way of doing this):

    Example

    Code:
    < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">





    Red:
    Blue:


    # June 17, 2009 at 10:24 am

    Very interesting. This is really going to help me. I will post back later today (I hope) with my solution (which may be a bit clunky…).

    Thanks mattch!

    # June 17, 2009 at 11:03 am
    "mattch" wrote:
    Code:
    if ($(‘.’ + color).length > 0) {
    $(‘div.’ + color).remove();

    Can you please explain that part a bit more? What does ‘.’ mean?

    UPDATE: Ah, I see…you were writing a div with a class if the box is checked and looking for and removing if it is unchecked.

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".