Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>OK, I think I get what you need. First of all, if you're using jQuery, you can use any CSS selector as your selector to get your element. For instance, to get an input with the <code>id</code> of <code>checkbox123</code>, you would simply:</p> <pre><code>$('#checkbox123') </code></pre> <p>However, if you wanted a collection of input <code>checkbox</code>es within a <code>ul</code>, then you could select like:</p> <pre><code>$('ul input[type=checkbox]') </code></pre> <p>Finally, determine whether or not it's checked is extremely simple.</p> <pre><code>var checked = $('#checkbox123').is(':checked'); // see your result in developer console with console.log(checked); // will be `true` or `false` </code></pre> <p>If you're trying to get the span (with text <code>Select This</code>) after, on a button click, you might try something like:</p> <pre><code>$('button').click(function(e) { $('ul input[type=checkbox]:checked').each(function(i) { var span = $(this).next('span'); alert(span.text()) }); }) </code></pre> <hr> <p>Last call, if you need to change the state of a checkbox, use <a href="http://api.jquery.com/prop/" rel="nofollow noreferrer"><code>.prop</code></a> on <code>checked</code> with a boolean value. Such as:</p> <pre><code>$('#checkbox123').prop('checked', true); // will make it checked $('#checkbox123').prop('checked', false); // will uncheck it </code></pre> <p>I believe this may have been updated since I last answered question, so I'll update answer here to show what's obviously missing.</p> <p>Finally, using jQuery to fire an event, such as <code>click</code> is extremely simple. There are also a couple ways to do such, some basically the same thing.</p> <p>The easiest is to use <a href="http://api.jquery.com/click/" rel="nofollow noreferrer"><code>.click()</code></a>. It's as simple as:</p> <pre><code>$('#checkbox123').click(); </code></pre> <p>Next use is <a href="http://api.jquery.com/trigger/" rel="nofollow noreferrer"><code>.trigger()</code></a>. Basically same thing as <code>.click</code>. <a href="https://stackoverflow.com/questions/9666471/jquery-advantages-differences-in-trigger-vs-click">Really this is just about personal use in readability</a>.</p> <pre><code>$('#checkbox123').trigger('click'); </code></pre> <p>Keep in mind, if you're using this, and it's not working. Something maybe wrong with your selector. One way to know for sure is to console log it. If you don't see a jQuery OBject Element printed to console containing the element you expect, then you know your selector isn't working. Keep in mind, this will show a jQuery Object regardless, but it will not have an HTML element in it. </p> <pre><code>console.log($('#checkbox123').trigger('click')); </code></pre> <p>If exist, will look something like:</p> <pre><code>[input#checkbox123, context: document, selector: "#content", jquery: "1.9.......and so on for rest of object </code></pre> <p>If not exist, will look something like:</p> <pre><code>[context: document, selector: "#checkbox123", jquery: "1.9.......and so on for rest of object </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload