查找具有空值的具有相同类的下一个元素

Question

我有一个这样的html结构：

<span class="btn btn-default btn-file">
  Upload Logo
  <input id="logo24" class="input-logo" name="options_24_file" type="file">
  <input style="display:none;" value="save_new" name="options_24_file_action" type="text">
  <input style="display:none;" id="logo27" class="input-logo" name="options_27_file" type="file">
  <input style="display:none;" value="save_new" name="options_27_file_action" type="text">
  <input style="display:none;" id="logo22" class="input-logo" name="options_22_file" type="file">
  <input style="display:none;" value="save_new" name="options_22_file_action" type="text">
  <input style="display:none;" id="logo25" class="input-logo" name="options_25_file" type="file">
  <input style="display:none;" value="save_new" name="options_25_file_action" type="text">
  <input style="display:none;" id="logo28" class="input-logo" name="options_28_file" type="file">
  <input style="display:none;" value="save_new" name="options_28_file_action" type="text">
  <input style="display:none;" id="logo23" class="input-logo" name="options_23_file" type="file">
  <input style="display:none;" value="save_new" name="options_23_file_action" type="text">
  <input style="display:none;" id="logo12" class="input-logo" name="options_12_file" type="file">
  <input style="display:none;" value="save_new" name="options_12_file_action" type="text">
  <input style="display:none;" id="logo26" class="input-logo" name="options_26_file" type="file">
  <input style="display:none;" value="save_new" name="options_26_file_action" type="text">
  <input style="display:none;" id="logo21" class="input-logo" name="options_21_file" type="file">
  <input style="display:none;" value="save_new" name="options_21_file_action" type="text">
  <input style="display:none;" id="logo29" class="input-logo" name="options_29_file" type="file">
  <input style="display:none;" value="save_new" name="options_29_file_action" type="text">
</span>

上面的html有输入类型文件，类名相同input-logo，第一个输入会首先显示，当输入值改变时我想隐藏它，并显示下一个输入仍然有空值显示出来，以便我可以输入另一个文件，到目前为止我已经尝试过：

$('.input-logo').change(function() {
   var id = $(this).attr('id');
   //get next class with no value and show it????
   //hide current element
   $(this).hide();
});

Answer 1

试试这个：

 $('.input-logo').change(function() {
     var id = $(this).attr('id');

     //hide current element
     $(this).hide();

     // check for null value
     $(".input-logo").each(function() {
       var input_val =$(this).val();
       if(input_val.trim()=='' || input_val==="undefined")
       {
         //perform action as you want
       }
       });
  });