gpt4 book ai didi

jquery - 通过each()中的索引继承另一个td的高度

转载 作者:行者123 更新时间:2023-12-01 04:38:41 25 4
gpt4 key购买 nike

我正在尝试使其并行 td 继承另一个 td 的高度。在我的示例中,我试图让 td 沃尔沃继承 Tiger td,但由于某种原因,它只会运行它找到的第一个 td,而不是其余的。

非常感谢您的帮助!

        $("tr").each(function(index, elem) {
var animals = $(this).find(".animals");
var cars = $(this).find(".cars");
$(cars).eq(animals.index()).height(animals.height())
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<link href="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet"/>
<html>
<body>
<div class="container">
<h2>Striped Rows</h2>
<p>The .table-striped class adds zebra-stripes to a table:</p>
<table class="table table-striped">
<thead>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Email</th>
<th>Animals</th>
<th>Cars</th>
</tr>
</thead>
<tbody>
<tr>
<td>John</td>
<td>Doe</td>
<td>john@example.com</td>
<td>Cow</td>
<td>Mouse</td>
</tr>
<tr>
<td>Mary</td>
<td>Moe</td>
<td>mary@example.com</td>
<td>Cat</td>
<td>Dog</td>
</tr>
<tr>
<td>July</td>
<td>Dooley</td>
<td>july@example.com</td>
<td>
<p class="animals" style="height:80px;">Fish</p>
<p class="animals">Bird</p>
<p class="animals" style="height:60px;">Tiger</p>
<p class="animals">Rhino</p>
</td>
<td>
<p class="cars">Mazda</p>
<p class="cars">Honda</p>
<p class="cars">Volvo</p>
<p class="cars">Opel</p>
</td>
</tr>
</tbody>
</table>
</div>
</body>

</html>

最佳答案

您需要捕获<p>标签的索引和高度,需要将其应用到相应的<p>最后一列中的标签如下:

$("tr").each(function(index, elem) {
var animals = $(this).find(".animals");
var trObj = $(this);
var cars = $(trObj).find(".cars");
$(animals).each(function(index1, elem1) {

$(cars).eq($(this).index()).height($(this).height())
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<link href="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" />
<html>

<body>
<div class="container">
<h2>Striped Rows</h2>
<p>The .table-striped class adds zebra-stripes to a table:</p>
<table class="table table-striped">
<thead>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Email</th>
<th>Animals</th>
<th>Cars</th>
</tr>
</thead>
<tbody>
<tr>
<td>John</td>
<td>Doe</td>
<td>john@example.com</td>
<td>Cow</td>
<td>Mouse</td>
</tr>
<tr>
<td>Mary</td>
<td>Moe</td>
<td>mary@example.com</td>
<td>Cat</td>
<td>Dog</td>
</tr>
<tr>
<td>July</td>
<td>Dooley</td>
<td>july@example.com</td>
<td>
<p class="animals" style="height:80px;">Fish</p>
<p class="animals">Bird</p>
<p class="animals" style="height:60px;">Tiger</p>
<p class="animals">Rhino</p>
</td>
<td>
<p class="cars">Mazda</p>
<p class="cars">Honda</p>
<p class="cars">Volvo</p>
<p class="cars">Opel</p>
</td>
</tr>
</tbody>
</table>
</div>
</body>

</html>

关于jquery - 通过each()中的索引继承另一个td的高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44181048/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com