フリーズ（スクロール可能な）垂直および水平の行/列を持つHTMLテーブル

Question

jsonからHTMLテーブルを作成しようとしています。私は、私が見つけたサンプルコードに基づいて必要な正確なフォーマットを生成することができます。発生するjavascriptは、含まれているdivのCSSを変更するオブジェクトを作成しているようです。静的データとして使用されるHTML（JSONから生成）は100％動作します。

の作業例 - 私はJSONを読み取り、テーブルを構築JavaScriptからHTMLを生成するとき http://www.cocopine.co.za/code/index.html

私の問題はあるが、Javascriptをあまりにも早く火災やテーブルのdivのスクロールに何もしないようです。 私はJavascriptをとても使い慣れており、JSファイルのコードは変更が必要で、現時点では私のレベルを少し超えています。

エラーJavascriptの生成されたページ - 要するにhttp://www.cocopine.co.za/code/grid1.html

：（垂直方向と水平方向）にスクロールしたときgrid1.htmlがindex.htmlのと同じように振る舞うべき

生成されたHTML上で動作していないのJavascript私は、JSONファイル処理のためのjQueryのコールバック関数内のコードを実行することによって、この作業を取得するために管理している

(function() { 
    var demo, fixedTable; 
    fixedTable = function(el) { 
    var $body, $header, $sidebar; 
    $body = $(el).find('.fixedTable-body'); 
    $sidebar = $(el).find('.fixedTable-sidebar table'); 
    $header = $(el).find('.fixedTable-header table'); 
    return $($body).scroll(function() { 
     $($sidebar).css('margin-top', -$($body).scrollTop()); 
     return $($header).css('margin-left', -$($body).scrollLeft()); 
    }); 
    }; 

    demo = new fixedTable($('#demo')); 

}).call(this); 

Answer 1

：以下です。

私はjqueryの非同期イベントにあまり慣れていませんが、明らかにjsonコールが起きていて、JSONとHTMLの処理でコードの次のビットに移動し、バックグラウンドで発生し、jsの後でのみ完了しますコードはすでに終了しています。

要するに、 jsコードは、すべてのテーブルとdivの追加後に追加されました。

... 
sideTable.appendChild(tbody); 
       aside.appendChild(sideTable); 
       div.appendChild(aside); 
       divBody.appendChild(tableBody) 
       div.appendChild(divBody); 
       element.appendChild(div);     

       var demo, fixedTable; 
        fixedTable = function(el) { 
        var $body, $header, $sidebar; 
        $body = $(el).find('.fixedTable-body'); 
        $sidebar = $(el).find('.fixedTable-sidebar table'); 
        $header = $(el).find('.fixedTable-header table'); 
        return $($body).scroll(function() { 
         $($sidebar).css('margin-top', -$($body).scrollTop()); 
         return $($header).css('margin-left', -$($body).scrollLeft()); 
        }); 
        }; 

        demo = new fixedTable($('#demo')); 

       } 

      }); 

}  

...