jquery每个循环仅第一次工作

s3fp2yjn 于 2021-09-23 发布在 Java

关注(0)|答案(1)|浏览(227)

我有两个 divs ，每个div有另一个div（用于标签），然后是值。
我希望这些标签也被添加到项目的左侧。
https://jsfiddle.net/eavblgnq/
当前html输出：

ID
Name
4343
Alpha
657
Team
Age
Job
23
Teacher
44
Coder

预期结果：

ID
Name
ID 4343
Name Alpha
ID 657
Name Team
Age
Job
Age 23
Job Teacher
Age 44
Job Coder

我得到的是：

ID
Name
ID 4343
Name Alpha
ID 657
Name Team
Age
Job
ID 23
Name Teacher
ID 44
Name Coder

jquery代码：

let pu_cells = []
  let table_ = $('.pu')

  table_.each(function(){
    let this_pu = $(this)
      this_pu.find(".pu-row_0 .pu-pk-cell").each(function(){
        pu_cells.push($(this).text())
      })

      this_pu.find('.pu-row:not(.pu-row_0)').each(function(i){
        $(this).find('.pu-pk-cell').each(function(j){
          $(this).html('<span class="pu-cell-label"> '+pu_cells[j]+'</span> ' + $(this).text())
        })
      })
})

jquery JavaScript

来源：https://stackoverflow.com/questions/68474214/jquery-each-loop-works-for-first-time-only

1条答案

按热度按时间

fzwojiic1#

您永远不会重置的值 pu_cells 第二个呢 div 它也有第一个单元格值( ID,Name 我是说）。
所以就放 let pu_cells = [] 在每个循环中。

let table_ = $('.pu')

        table_.each(function () {
            let pu_cells = []
            let this_pu = $(this)
            this_pu.find(".pu-row_0 .pu-pk-cell").each(function () {
                pu_cells.push($(this).text())
            })

            this_pu.find('.pu-row:not(.pu-row_0)').each(function (i) {
                $(this).find('.pu-pk-cell').each(function (j) {
                    $(this).html('<span class="pu-cell-label"> ' + pu_cells[j] + '</span> ' + $(this).text())
                })
            })
        })

.pu-cell-label {
            color: red;
        }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <div class="pu pu_0">
        <div>
            <div>
                <div class="pu-row pu-row_0">
                    <div>
                        <div>
                            <div class="pu-pk-cell">ID</div>
                            <div class="pu-pk-cell">Name</div>
                        </div>
                    </div>
                </div>
                <div class="pu-row pu-row_1">
                    <div>
                        <div>
                            <div class="pu-pk-cell">4343</div>
                            <div class="pu-pk-cell">Alpha</div>
                        </div>
                    </div>
                </div>
                <div class="pu-row pu-row_2">
                    <div>
                        <div>
                            <div class="pu-pk-cell">657</div>
                            <div class="pu-pk-cell">Team</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="pu pu_1">
        <div>
            <div>
                <div class="pu-row pu-row_0">
                    <div>
                        <div>
                            <div class="pu-pk-cell">Age</div>
                            <div class="pu-pk-cell">Job</div>
                        </div>
                    </div>
                </div>
                <div class="pu-row pu-row_1">
                    <div>
                        <div class="pu-da-row">
                            <div class="pu-pk-cell">23</div>
                            <div class="pu-pk-cell">Teacher</div>
                        </div>
                    </div>
                </div>
                <div class="pu-row pu-row_2">
                    <div>
                        <div>
                            <div class="pu-pk-cell">44</div>
                            <div class="pu-pk-cell">Coder</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

赞(0）回复(0）举报 2021-09-23

我来回答

jquery每个循环仅第一次工作

1条答案

相关问题

热门标签

最新问答