2010-01-05 44 views
0

我有一個HTML表格(20行)。 每行都有使用數據庫中的單個數據集填充的國家(大約250個國家/地區)的列表框。呈現20個大的相同列表框

加載時間足夠快,但渲染時間真的很亂。 有什麼辦法可以加快這些列表框的渲染速度嗎?

+0

我剛剛給我的答案加了一些代碼 – marcgg 2010-01-05 09:46:51

+0

更新了我的答案。 – 2010-01-05 11:37:38

回答

1

你可以加載它只有一次,然後到處複製的DOM元素,你需要它...

我不知道這是否會提高很多,因爲它會更依賴用戶的計算機上,但如果現在的方式太慢,我認爲值得嘗試。

編輯:這是我該怎麼做。謹慎使用,我沒有對它進行測試,而且這個代碼很可能有很多錯誤,只是讓你知道我在說什麼。

<mylistbox id="listboxtemplate"> ... </> 

<div class="thisPlaceNeedsAListbox"></div> 
<div class="thisPlaceNeedsAListbox"></div> 
<div class="thisPlaceNeedsAListbox"></div> 

在文件準備好,使用jQuery:

jQuery(".thisPlaceNeedsAListbox").append(jQuery("#listboxtemplate").clone()) 
+0

我會試試看(雖然我會把jquery翻譯成mootools) – Faruz 2010-01-05 09:48:00

+0

你也可以鏈接clone(),那會更好。但我現在沒有那麼多時間去做 – marcgg 2010-01-05 09:48:29

+0

(參考這裏:http://docs.jquery.com/Manipulation/clone) – marcgg 2010-01-05 09:48:59

1

你可以嘗試添加用戶已經選擇前一個(使用JavaScript)後,纔在下一個選擇框。

我很確定您可以重新考慮表單或過程,但由於您沒有提供足夠的信息,因此無法提出任何具體的建議。例如,根據情況,您可以使用多選或一些奇特的JavaScript小部件。

編輯根據您的評論:

那麼怎麼樣服表而不選擇。如果用戶雙擊國家字段,則更改文本元素以使用javascript選擇元素。一旦用戶選擇了國家,您可以更改回文本元素。您可以使用Ajax將結果提交回服務器(在用戶選擇國家後)或使用隱藏字段提交按鈕。這種方式DOM永遠不會包含多於一個select元素。

您可以使用內聯JSON對象/數組(在腳本標記中)將國家/地區傳遞給JavaScript。爲了讓用戶在編輯第一個元素後更快,只需隱藏(css:display:none;)第一個build select元素,並在每次用戶想要編輯行時克隆/移動它。

正如您所看到的,您可以使用這種方法獲得很多路徑,這完全取決於您想要優化/處理多少路徑。

+0

愛這個主意!我會給你「正確的答案」,但它是一種解決方法,而不是回答確切的問題。儘管如此 - 這是我將要使用的方向。 – Faruz 2010-01-05 11:45:23

相關問題