Table顯示滾動條


項目中需要在js文件中動態的往table里面添加數據,當數據的量到一定的程度的時候,就希望能夠出現滾動條,現記錄如下:

Html文件:
<div style="width:468px;height:260px;overflow:scroll;background:#9D9D9D;"> <table id="detail" style="width:450px;background:#9D9D9D;border-collapse:separate; border-spacing:0px 0px;"> </table> </div>

 

var detail="";
            detail += '<thead>';
            detail += '<tr>';
            detail += '<th align="left">時間</th>';
            detail += '<th align="left">用戶</th>';
            detail += '<th align="left">出價</th>';
            detail += '</tr>';
            detail += '</thead>';

      detail += '<body>';
      for (var i=0;i<result.length;i++) {
        detail += '<tr>';
        detail += '<td style="width:200px;height:10px;" valign="top">'+result[i].priceTime+'</td>';
        detail += '<td valign="top">'+result[i].account+'</td>';
        detail += '<td valign="top">'+result[i].price+'</td>';
        detail += '<tr>';
      }
      detail += '</body>';

document.getElementById('detail').innerHTML = detail;

 

 

Table顯示滾動條,要先把table放到一個div中,div的長度和寬度要固定,控制overflow屬性為scroll

現在只要table的長度或是寬度大於div的長度或是寬度,滾動條就顯示出來了。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM