Search code examples
jquerycssselectorhiddenvisible

Select all form elements using jquery except those that are hidden by CSS

I want to select all form elements using jQuery, which I know I can do using 

$(':input')

but then I don't want to select elements that are hidden by CSS, which I can do with

$(':input:visible')

but the one thing that I do want to get are these:

<input type="hidden" />

I'm just not wanting to get element that are hidden because either they or their parent is hidden with something like:

style="display:none;"

etc

Thoughts?

Thanks!

Solution

  • Try

    $(':input').filter(function () {
    return (this.type.toUpperCase() == 'HIDDEN' && !$(this).parent().is(':hidden')) || !$(this).is(':hidden');
})

    or

    (':input:visible').add($('input[type="hidden"]'))