如何找到表中的所有输入文本框都为空?

时间:2017-12-12 08:54:13

标签: javascript jquery

我有一个包含

等数据的html表
<table>
  <tr>
    <td>abc</td>
    <td>781</td>
    <td><input id="barcodedb0" class="hide" type="text" /><input id="barcode0" class="hide" type="text" /></td>
  </tr>
  <tr>
    <td>abc</td>
    <td>781</td>
    <td><input id="barcodedb0" class="hide" type="text" /><input id="barcode0" class="hide" type="text" /></td>
  </tr>
</table>

在JQuery中

$('#library_info_tbl tbody').on("keyup", "tr td input:nth-child(2)", function() {
   if(all the textboxes are empty)
    // do something
});

我试图找出如何检查表中的所有文本框都是空的。

请注意,带有“隐藏”类的文本框将被隐藏,并用于其他目的。

请帮助!!!

5 个答案:

答案 0 :(得分:1)

试试这个

var allempty = true;
$('.hide').each(function(){
       if($(this).val()!=''){
          allempty = false;
       }else{
          allempty = true;
       }
    });

if(allempty) {
   //this is empty
}

答案 1 :(得分:1)

您可以使用input[type=text]作为选择器:

对于ie:

var emptyValues = 0;
$('table input[type=text]').each(function(){
   if($(this).val() != ''){
      console.log($(this).val());
      emptyValues = 1;
   }
});
if(emptyValues == 0){
   //enter code here
}

答案 2 :(得分:1)

考虑到您的表格为tableId,您可以尝试:

if($("table#tableId input[class!='hide'][value='']").length == $("table#tableId input[class!='hide']").length) {
// do something
}

或简单地说:

if($("table input[class!='hide'][value='']").length == $("table input[class!='hide']").length) {
// do something
}

答案 3 :(得分:1)

你可以用它 此代码仅适用于第二次输入。

$('#library_info_tbl tbody').on("keyup", "tr td input:nth-child(2)", function() {
        var oneEmpty = false;
        $("#library_info_tbl tbody tr td input:nth-child(2)").filter(function () {
              return $.trim($(this).val()) == '';
        });
        if(oneEmpty)
        // do something
 });

此代码仅适用于所有输入。

$('#library_info_tbl tbody').on("keyup", "tr td input:nth-child(2)", function() {

        if($("#library_info_tbl tbody input:empty").length == $("#library_info_tbl tbody input").length)
        {
        // do something
        }
 });

// Instead of $("#library_info_tbl tbody input:empty") you can also use $("input.hide:empty")

答案 4 :(得分:1)

您可以通过for循环迭代来完成并检查每个值

function checkEmpty(){
  var elems = $("table input[type=text]");
  var isEmpty = false;
  for(let i=0 ; i < elems.length;i++){
    if($(elems[i]).val().trim() != ''){
      isEmpty = true;
      break;
    }
  }
  $("#isempty").html(isEmpty?'All Not Empty':'All Empty');
  //return isEmpty;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>abc</td>
    <td>781</td>
    <td><input id="barcodedb0" class="hide" type="text" /><input id="barcode0" class="hide" type="text" /></td>
  </tr>
  <tr>
    <td>abc</td>
    <td>781</td>
    <td><input id="barcodedb1" class="hide" type="text" /><input id="barcode1" class="hide" type="text" /></td>
  </tr>
</table>
<input onclick="checkEmpty()" type="button" value="check empty"/>
<div id="isempty"></div>

关注重复ID