JSFiddle - React, Tailwind, and code Playground
HTML
<p>The below box is checked, but marked indeterminate. If it were part of a form, it would be submitted normally (indeterminate value has no effect on form submission). However, it isn't properly matched with the <strong>:checked</strong> selector by jQuery in WebKit browsers.</p>
<input type='checkbox' checked />
CSS
p span { color: green }
JavaScript
// make the input box indeterminate (but still checked!)
var $input = $('input');
$input.get(0).indeterminate=true;
// display if the item matches the test
log( ".is(':checked')", $input.is(':checked') );
if( document.body.webkitMatchesSelector )
{
log( ".webkitMatchesSelector(':checked')",
$input.get(0).webkitMatchesSelector(':checked'));
}
// some
if( $input.prop )
log( ".prop('checked')", $input.prop('checked') );
// little function for logging
function log(label, result)
{
$('<p>'+label+': <span>'+result+'</span></p>')
.appendTo('body');
}