javascript - 使用 .each 在 Backbone View 中循环遍历具有相同类的元素？

Question

我正在使用 Backbone 和 JQuery，并想创建一个指向 create equal height columns as described in method 2 of this link 的 Backbone View . HTML 看起来像这样:

<div class="container">
 <div  id="leftcolumn" class="set_equal_height"> … Lots Of Content … </div>
 <div id="middlecolumn" class="set_equal_height"> … Lots Of Content … </div>
 <div  id="rightcolumn" class="set_equal_height"> … Lots Of Content … </div>
</div>

我将以下 Backbone View 组合在一起，但它无法正常工作，大概是因为使用 .each 的循环无法正常工作(页面加载没有错误，但列的高度未被 javascript 修改):

define([
  'jquery',
  'underscore',
  'backbone',
], function($, _, Backbone) {
  var SetEqualHeight = Backbone.View.extend({
    initialize: function() {
      var tallestcolumn = 0;
      console.log(this.$el.height());
      console.log(this.$el.attr("id"));
      this.$el.each(function() {
        currentHeight = $(this).height();
        console.log(currentHeight);
        if(currentHeight > tallestcolumn) {
            tallestcolumn  = currentHeight;
        }
      });
    this.$el.height(tallestcolumn);
    },
  });
  return SetEqualHeight;
});

我在单独的 Wire 规范中定义了“el”参数，如下所示:{ el: 'div.set_equal_height' }，自从“console.log(this.$el.height() )"和上面代码中的 console.log(this.$el.attr("id")) 正确打印出来。但是“.each”语句里面的console.log没有打印出来，说明“.each”有问题。我看了this question并尝试了下划线“_.each”方法，但无法弄清楚如何迭代具有给定类(即 div.set_equal_height)而不是给定数组的元素。谁能启发我在上面的主干 View 中使 .each 工作？请!!!

仅供引用，以下函数可自行运行(我希望将其合并为主干 View 或 View 助手):

function setEqualHeight(columns) {
 var tallestcolumn = 0;
 columns.each(function() {
  currentHeight = $(this).height();
  if(currentHeight > tallestcolumn) {
   tallestcolumn  = currentHeight;
  }
 });
 columns.height(tallestcolumn);
}
$(document).ready(function() {
 setEqualHeight($("div.set_equal_height"));
});

Answer 1

我假设您正在用这样的东西实例化您的 View ？

new SetEqualHeight({el: '.container')

如果是这样，这意味着 $el 将被设置为您 View 中的容器 div。 $(anything).each 将遍历 "anything"的所有成员...但在您的情况下，只有一个成员 ('.container')。

解决方案是改变这一行:

this.$el.each(function() {

到:

this.$el.find('.set_equal_height').each(function() {

或者更好(更多的 Backbone-y):

this.$('.set_equal_height').each(function() {

希望对您有所帮助。