将表结果迭代到具有相同类的不同div

Question

Using this code....trying to get the result from each multiple table and target the result to a div that has the same class...one result from each table to each div....without adding any id's etc....and not using .after(). 使用此代码....尝试从每个多个表中获取结果并将结果定位到具有相同类的div ...从每个表到每个div中的一个结果....而不添加任何id等。 ..而不使用.after（）。 Hope that makes sense. 希望有道理。 You can see some console.logs I have set up...but can't seem to get it to populate the divs with the correct results. 您可以看到我设置的一些console.logs ...但是似乎无法用正确的结果填充div。

<html>
    <head>
        <script src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
        <script type="text/javascript">
$(document).ready(function() {

//Get Number of Divs with class='sum'
var divN = $( ".sum" ).length;
console.log('Number of Divs in page that match class sum : ' + divN);

//Get Number of TDs with class='two'
var tdN = $( ".two" ).length;
console.log('Number of TDs in page that match class two : ' + tdN);

//Get Number of Tables
var tblN = $( "table" ).length;
console.log('Number of Tables in page : ' + tblN);

//Get Number of TDs with class='two' in each table
$("table").each(function(){
tblSum = $('.two', this).length;
console.log('Number of TDs that match class two in each Table : ' + tblSum);
});

//Get result from each table and place it in div class="sum"
$(".sum").text(tblSum);
});

        </script>
    </head>
    <body>
<table>
        <tr><td class="one">Test</td></tr>
        <tr><td class="one">Test</td></tr>
        <tr><td class="one two">Test</td></tr>
        <tr><td class="one">Test</td></tr>
        <tr><td class="one">Test</td></tr>
        <tr><td class="one two">Test</td></tr>

</table>
<div class="sum"></div>
<table>
        <tr><td class="one">Test</td></tr>
        <tr><td class="one">Test</td></tr>
        <tr><td class="one two">Test</td></tr>
        <tr><td class="one">Test</td></tr>
        <tr><td class="one">Test</td></tr>
        <tr><td class="one">Test</td></tr>

</table>
<div class="sum"></div>

</body>
</html>

Answer 1

You could use the next() function like : 您可以使用next()函数，例如：

$(this).next('.sum').text(tblSum);

 $(document).ready(function() { $("table").each(function() { var tblSum = $('.two', this).length; $(this).next('.sum').text(tblSum); }); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr> <td class="one">Test</td> </tr> <tr> <td class="one">Test</td> </tr> <tr> <td class="one two">Test</td> </tr> <tr> <td class="one">Test</td> </tr> <tr> <td class="one">Test</td> </tr> <tr> <td class="one two">Test</td> </tr> </table> <div class="sum"></div> <table> <tr> <td class="one">Test</td> </tr> <tr> <td class="one">Test</td> </tr> <tr> <td class="one two">Test</td> </tr> <tr> <td class="one">Test</td> </tr> <tr> <td class="one">Test</td> </tr> <tr> <td class="one">Test</td> </tr> </table> <div class="sum"></div>

将表结果迭代到具有相同类的不同div

问题描述

1 个解决方案

解决方案1
1 已采纳 2018-08-09 09:22:22

将表结果迭代到具有相同类的不同div

问题描述

1 个解决方案

解决方案1 1 已采纳 2018-08-09 09:22:22

解决方案1
1 已采纳 2018-08-09 09:22:22