テーブル内のすべての入力テキストボックスが空であることを確認するにはどうすればよいですか？

Question

私はjQueryの

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

で

<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> 

のようなデータを持つHTMLテーブルを持っている私は、テーブル内のすべてのテキストボックスが空であることを確認する方法を見つけるためにしようとしています。

「hide」クラスのテキストボックスは非表示であり、他の目的に使用されています。

助けてください！

Answer 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") 

Answer 2

あなたはセレクタとしてinput[type=text]を使用することができ、この

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

if(allempty) { 
    //this is empty 
} 

Answer 3

をお試しください：

IE用：あなたのテーブルのIDを考慮

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

Answer 4

が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 
} 

Answer 5

あなたは

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の