<div class="tab-pane" id="checkfeedhide">
<div class="row">
<div class="col-md-6 col-xs-12">
<fieldset class="schedule-border">
<div class="row">...</div>
<div class="row check_list_feed">
<div class="col-md-12 col-xs-12">
<div class="table-responsive">
<table class="table table-bordered tbl-each">...</table>
<table class="table table-bordered tbl-each">...</table>
<table class="table table-bordered tbl-each">...</table>
<table class="table table-bordered tbl-each">...</table>
<table class="table table-bordered tbl-each">...</table>
<table class="table table-bordered tbl-each">...</table>
</div>
</div>
</div>
</fieldset>
</div>
</div>
我需要使用类名tbl-each获取每个表的高度。因此，我尝试获取如下表所示的表格。
$(document).ready(function() {
$("#checkfeedhide").children().find('.tbl-each').each(function(index, val) {
var height = $(this).height();
console.log(height+' '+index);
});
});
但是当我用上面的代码获得表格的高度时，它总是返回-2。如何获得类名称为.tbl-each的每个表的实际值。
答案 0 :(得分：-1)
您可以尝试一下。对我来说真是令人头疼。
$(document).ready(function() {
$("#checkfeedhide").children().find('.tbl-each').each(function(index, val) {
var height = $(this).height();
console.log(height+' '+index);
});
});<html>
<head>
<title>User Registration PHP & MYSQL</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<style type="text/css">
table.table.table-bordered.tbl-each {
border: 1px solid black;
}
</style>
</head>
<body>
<div class="tab-pane" id="checkfeedhide">
<div class="row">
<div class="col-md-6 col-xs-12">
<fieldset class="schedule-border">
<div class="row">...</div>
<div class="row check_list_feed">
<div class="col-md-12 col-xs-12">
<div class="table-responsive">
<P>FIRST TABLE</P>
<table class="table table-bordered tbl-each">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
</table>
<P>SECOND TABLE</P>
<table class="table table-bordered tbl-each">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
<P>THIRD TABLE</P>
<table class="table table-bordered tbl-each">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
</table>
<P>FOURTH TABLE</P>
<table class="table table-bordered tbl-each">
<tr>
<th>A</th>
<th>B</th>
<th>C</th>
</tr>
<tr>
<td>10</td>
<td>20</td>
<td>30</td>
</tr>
</table>
<P>FIFTH TABLE</P>
<table class="table table-bordered tbl-each">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
</table>
<P>SIXTH TABLE</P>
<table class="table table-bordered tbl-each">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
</table>
</div>
</div>
</div>
</fieldset>
</div>
</div>
</body>
</html>
答案 1 :(得分：-1)
$(document).ready(function() { $('.tbl-each').each(function(){ console.log($(this).height()); }) });<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="table-responsive">
<table style="height: 20px;border: 1px solid gray;width: 20px;" class="table table-bordered tbl-each">...</table>
<table style="height: 40px;border: 1px solid gray;width: 20px;" class="table table-bordered tbl-each">...</table>
<table style="height: 10px;border: 1px solid gray;width: 20px;" class="table table-bordered tbl-each">...</table>
<table style="height: 12px;border: 1px solid gray;width: 20px;" class="table table-bordered tbl-each">...</table>
<table style="height: 11px;border: 1px solid gray;width: 20px;" class="table table-bordered tbl-each">...</table>
<table style="height: 22px;border: 1px solid gray;width: 20px;" class="table table-bordered tbl-each">...</table>
</div>