1

私はバックボーンと JQuery を使用しており、このリンクの方法 2 で説明されているように、バックボーン ビューを作成して同じ高さの列を作成したいと考えています。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.attr("id")) は正しく出力されます。ただし、「.each」ステートメント内の console.log は出力されず、「.each」に問題があることが示されます。この質問を見て、アンダースコアの「_.each」メソッドを試してみましたが、特定の配列ではなく特定のクラス (つまり、div.set_equal_height) を持つ要素を反復処理する方法がわかりませんでした。上記のバックボーン ビューで .each を機能させることについて誰か教えてもらえますか? お願いします!!!

参考までに、次の関数は単独で機能します (バックボーン ビューまたはビュー ヘルパーとして組み込むことを考えています)。

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"));
});
4

1 に答える 1

2

このようなものでビューをインスタンス化していると思いますか?

new SetEqualHeight({el: '.container')

もしそうなら、それは$elあなたのビュー内のコンテナdivに設定されることを意味します。 $(anything).each"" ...のすべてのメンバーを繰り返し処理anythingしますが、あなたの場合、メンバーは1つだけです('.container')。

解決策は、次の行を変更することです。

this.$el.each(function() {

に:

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

またはそれ以上(より多くのBackbone-y):

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

お役に立てば幸いです。

于 2012-07-06T19:31:14.600 に答える