Javascript jScrollPane在服務器端包裝內容

Question

是否有可能爲服務器端的JavaScript庫jScrollPane預先標記標記？當庫初始化元素上的滾動條時，它會將內容封裝起來併爲滾動添加一些元素。通常情況下，這很好，但是當您嘗試在大量數據上使用它時，性能非常糟糕。任何人都知道如何處理？

我試着手動添加滾動元素，但jScrollPane初始化後再次添加這些元素。感謝您的評論。

具體而言：

通常：

<script src="http://jscrollpane.kelvinluck.com/script/jquery.jscrollpane.min.js"></script> 
<div id="scroll"> 
    <div id="content"> 
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ullamcorper rutrum vehicula. 
    <div> 
</div> 

後的jQuery（ '＃滾動'）JScrollPane的（）;：

<script src="http://jscrollpane.kelvinluck.com/script/jquery.jscrollpane.min.js"></script> 
<div id="scroll" style="overflow: hidden; padding: 0px; width: 400px;" class="jspScrollable" tabindex="0"> 
    <div class="jspContainer" style="width: 400px; height: 400px;"> 
     <div class="jspPane" style="padding: 0px; width: 380px; top: 0px;"> 
      <div id="content"> 
       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ullamcorper rutrum vehicula. 
       <div> 
       </div> 
      </div> 
     </div> 
     <div class="jspVerticalBar"> 
      <div class="jspCap jspCapTop"> 
      </div> 
      <div class="jspTrack" style="height: 400px;"> 
       <div class="jspDrag" style="height: 200px;"> 
        <div class="jspDragTop"> 
        </div> 
        <div class="jspDragBottom"> 
        </div> 
       </div> 
      </div> 
      <div class="jspCap jspCapBottom"> 
      </div> 
     </div> 
    </div> 
</div>​ 

看：http://jsfiddle.net/Au5Tx/14/

的事情是，我需要預生成服務器上所有的div元素，以防止對DOM樹的操作。事件，如果我試圖做到這一點，jScrollPane再次封裝：

<div id="scroll" style="overflow: hidden; padding: 0px; width: 400px;" class=""> 
    <div class="jspContainer" style="width: 400px; height: 400px;"> 
     <div class="jspPane" style="padding: 0px; top: 0px; width: 400px;"> 
      <div class="jspContainer" style="width: 400px; height: 400px;"> 
       <div class="jspPane" style="padding: 0px; width: 380px; top: 0px;"> 
        <div id="content"> 
         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ullamcorper rutrum vehicula. 
         <div> 
         </div> 
        </div> 
       </div> 
       <div class="jspVerticalBar"> 
        <div class="jspCap jspCapTop"> 
        </div> 
        <div class="jspTrack" style="height: 400px;"> 
         <div class="jspDrag" style="height: 200px;"> 
          <div class="jspDragTop"> 
          </div> 
          <div class="jspDragBottom"> 
          </div> 
         </div> 
        </div> 
        <div class="jspCap jspCapBottom"> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div>​ 

而且它不工作。有沒有解決方案？

Answer 1

由於javascript是客戶端，我不知道要完成你所需要的選項。我知道現在還有服務器端的js，但從我的經驗來看，這並不是什麼嚴肅的事情。如果你覺得它沒有足夠的性能，你沒有提供足夠的關於你的系統或你的代碼的信息。因此無法判斷是否導致這些問題或實現方式的jScollPane。從我看來，大部分時間都是自己的代碼。否則，您可能會嘗試不同的自定義滾動條或使用css（3）webkit滾動條。