jQuery：选择div，其中所有选择内部没有0值

Question

I have the following html structure:

<div class="subform_uploading" id="subform1">
    <select class="form_file">
        <option value="0">Select file</option>
        <option value="file1">file1</option>
        ...
        <option value="file10">file10</option>
    <select>
    <select class="form_title">
        <option value="0">Select Title</option>
        <option value="title1">title1</option>
        ...
        <option value="title10">title10</option>
    <select>
</div>
...
<div class="subform_uploading" id="subform5">
    <select class="form_file">
        <option value="0">Select file</option>
        <option value="file1">file1</option>
        ...
        <option value="file10">file10</option>
    <select>
    <select class="form_title">
        <option value="0">Select Title</option>
        <option value="title1">title1</option>
        ...
        <option value="title10">title10</option>
    <select>
</div>

What I like to get with jQuery is number of div elements with "subform_uploading" class where both select values are not equal to 0.

Answer 1

You just need to compare the number of <select> elements within each <div> against the number of <select> elements in each <div> where the value is not 0 :

var numDivs = $('div.subform_uploading').filter(function() {

  var $this = $(this), 
      $select = $this.find('select');

  return $select.length == $select.filter(function() { return this.value != 0 }).length; 

}).length;

Here's a fiddle

Answer 2

Try a filter like

$('button').click(function () {
    var $els = $('.subform_uploading').filter(function () {
        return $(this).find('select').filter(function () {
            return $(this).val() == 0
        }).length == 0;
    });
    console.log($els, $els.length)
})

Demo: Fiddle

Answer 3

var count = 0;
$('.subform_uploading').each(function(i) {
    select1 = $(this).find('select').eq(0).val();
    select2 = $(this).find('select').eq(1).val();
    if(select1 != '0' && select2 != '0') {
        count++;
    }
});

Answer 4

I am not sure if there is a way using a one liner jquery selector. THis function though will return what you wanted.

Demo : JSFiddle

function getDivs () {
    var outDivs = [];
    var divs = $('div.subform_uploading');
    divs.each (function ( ) {
       var sels =   $(this).find ('select option[value!="0"]:selected');
       if (sels.length == 2) {
            outDivs.push ( $(this) );
       }
   });
   return outDivs;
 }