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

Question

我正在使用 Backbone 和 JQuery，并希望为 create equal height columns as described in method 2 of this link 创建一个 Backbone 视图。 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>

我将以下主干视图放在一起，但它无法正常工作，可能是因为使用 .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）而不是给定数组迭代元素。谁能启发我让 .each 在上面的主干视图中工作？请！！！

仅供参考，以下函数可自行工作（我希望将其合并为 Backbone 视图或视图助手）：

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

我假设你正在用这样的东西实例化你的视图？

new SetEqualHeight({el: '.container')

如果是这样，这意味着$el 将被设置为您视图内的容器 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() {

希望对您有所帮助。