Question

我需要一些建议：

<div class="container p-rows">
  <div class="row">
    <div class="col-lg-6">
      <p class="ck-edit-col-bodytext">some text</div>
    </div>

    <div class="col-lg-6">
      <p class="ck-edit-col-bodytext">some more more text</div>
    </div>
  </div>

  <div class="row">
    <div class="col-lg-6">
      <p class="ck-edit-col-bodytext">some text</div>
    </div>

    <div class="col-lg-6">
      <p class="ck-edit-col-bodytext">some more more text</div>
    </div>
  </div>

  <div class="row">
    <div class="col-lg-6">
      <p class="ck-edit-col-bodytext">some text</div>
    </div>

    <div class="col-lg-6">
      <p class="ck-edit-col-bodytext">some more more text</div>
    </div>
  </div>

  <!-- some more rows -->
</div>

每行中的每个p标记都有不同的高度，具体取决于其中的文本数量。我想要做的是遍历每一行并检测哪个p标签具有最多height。然后将行中的所有其他p标记设置为相同的高度。

我的尝试：

var pTagHeight = -1;
jQ('.p-rows .row').each(function() {
  pTagHeight = pTagHeight > jQ('.ck-edit-col-bodytext').height() ? pTagHeight : jQ('.ck-edit-col-bodytext').height();
  jQ('.ck-edit-col-bodytext').height(pTagHeight);
  pTagHeight = -1;
});

但是我无法让它发挥作用。有什么想法吗？

Answer 1

您需要先遍历每一行并计算该行中最高的p标记，然后将该高度应用于所有相关的p。

试试这个：

jQ('.p-rows .row').each(function() {
    var $p = jQ(this).find('p');
    var heights = $p.map(function(i, e) { return jQ(e).height(); }).get();
    $p.height(Math.max.apply(this, heights));
});

遍历每一行，使p标签的高度相同

1 个答案: