2011-08-06 11 views
0

ユーザーが自分のページ上の画像の異なる領域にカーソルを移動すると、詳細を示す表の内容を更新しています。この表の内容はサーバー側で生成されます。複数の非表示のdivまたは1つのdivのコンテンツを置き換えますか?

現時点では、それぞれのmouseoverイベントまで非表示になっている独自のdiv内に50種類以上の異なるテーブルを格納しています。

これを達成する最良の方法ですか?単一のdivのテーブルの内容を置き換えるためにjavascriptを使用する方が良いですか?それはユニークなコンテンツを持つ50の同じテーブル(構造的に)かどう

おかげで、A.

答えて

0

まあ、私はおそらくそのようにカスタムオブジェクトか何かのために解決、代わりの50個のテーブル(50テーブルを非表示にしたいです= 1テーブルに対する比較のオーバーヘッド)。

のjQueryを使用して(やや擬似)以下のことを試してみてください。

var data_rows = $('#table').children('tr'); 
var region_information = { 
    0: { name: "Foo", location: "Loo"}, 
    1:{ name: "Bar", location: "Car" }, 
    2{ name: "Car", location: "Garage"} 
}; 

$('.regions').hover(
    function() { 

     //Store the region for *performance* 
     var this_region = $('this');   

     /* 
      Set the values in the table by getting the field corresponding to the substring 
      The format = region-{n}, where {n} is a positive digit 
      Repeat this `n` times, according to how many "values" you need to display per table 
     */ 
     data_rows.children('field1').text(
      region_information[this_region.attr('name').substring(7, 1)] 
     ); 
    } 
); 

はこのメイクセンスをしましたか?あなたのテーブルがどのように見えるかわからないので、どうやってそれを行うのか正確には言えません。しかし、擬似的なコード(上記のようなコード)を提供することができますので、私はそれがあなたを助けることを願っています!

+0

ありがとうございました。私はこのようなものを実装しました。私はテーブルのセルをループし、テキストを置き換えます。 – chris

関連する問題