jQuery appendに変更が表示されませんか？

Question

Webアプリケーションを変更するスクリプトがあります。 何それは基本的にないことである：

1. はDOM
2. ウィンドウの高さや他のものに合わせて、いくつかのDOM要素のサイズを変更する動的な要素を追加します...だから

、私が行います

$(document).ready -> 
    $('.interval-view').wrapInner '<div class="column" />' 
    $('.column').wrapInner   '<div class="inner-column" />' 
    $('#contents, #footers').append '<div class="clearfix"></div>' 

    $('.interval-view:even').css 'background-color', '#F9F9F9' 
    $('.interval-view:odd').css 'background-color', '#DDD' 

    resize = -> 
    $('.column').height       $(window).height() - $('#filter-list').outerHeight(true) - $('#footers').outerHeight(true) 
    $('#timeline-panel').width     $(window).width() 
    $('#timeline-panel .scrollable-area').width "#{$('.interval-view').length * $('.interval-view').width()}px" 

    window.onorientationchange = -> 
    resize() 

    $(window).resize -> 
    resize() 

    resize() 

しかし、私は$('.column').heightに適切な高さの値を取得しません。私がclearfix要素を追加しなかったかのように、スクリプトは高さの値を取得します。最終的な高さを計算するときにその部分を考慮しないようなものです。

私は遅延オブジェクトを試してみましたが、成功しませんでした。それでも要素の考慮なしに高さを取る。 CoffeeScriptのない人々のため

、ここで私は、生成されたJavascriptを貼り付けます。それを修正する

$(document).ready(function() { 
    var resize; 
    $('.interval-view').wrapInner('<div class="column" />'); 
    $('.column').wrapInner('<div class="inner-column" />'); 
    $('#contents, #footers').append('<div class="clearfix"></div>'); 
    $('.interval-view:even').css('background-color', '#F9F9F9'); 
    $('.interval-view:odd').css('background-color', '#DDD'); 
    resize = function() { 
     $('.column').height($(window).height() - $('#filter-list').outerHeight(true) - $('#footers').outerHeight(true)); 
     $('#timeline-panel').width($(window).width()); 
     return $('#timeline-panel .scrollable-area').width("" + ($('.interval-view').length * $('.interval-view').width()) + "px"); 
    }; 
    window.onorientationchange = function() { 
     return resize(); 
    }; 
    $(window).resize(function() { 
     return resize(); 
    }); 
    return resize(); 
    }); 

任意の方法？ハンドラは をバインド：

Answer 1

これは.live（）メソッドは、まだ がイベントの委任を使用してDOMに追加されていない要素に影響を与えることが可能であるjQueryの.live

を使用して解決されるかもしれません祖先要素には、 子孫でトリガーされるイベントの原因となります。 .live（）に渡されたハンドラは決して 要素にバインドされません。代わりに、.live（）は特別なハンドラを DOMツリーのルートにバインドします。

Answer 2

.live（）は、ページがロードされた後に動的に作成された要素にイベントをバインドするために使用されます。 どのブラウザをお使いですか？ jQueryのバージョン.heigth（）と特定のブラウザでバグがあったことを思い出すので。

Answer 3

あなたはこのような生活をjQueryのに複数のイベント引数を渡すことができます注：私の問題は、イベントではない

$(window).live('resize onorientationchange', function() { 
    resize(); 
});