2013-05-31 29 views
0

我正在使用jQuery表来显示我的数据。在那里,我有2个按钮上一页和下一页用于分页。但我想在表格底部添加一个滚动条。我写了如何在表中添加滚动条

overflow:scroll 

在CSS中,但它没有工作。

这里是我的代码:

<%@page contentType="text/html" pageEncoding="UTF-8"%> 
<!DOCTYPE html> 
<html> 
<head> 

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <title>Query Result Page</title> 
    <link href="css/style.css" rel="stylesheet" type="text/css" /> 
    <link href="css/jquery.contextMenu.css" rel="stylesheet" type="text/css" /> 
    <link href="css/jdpicker.css" rel="stylesheet" type="text/css" /> 
    <script type="text/javascript" src="js/jquery-1.8.3.min.js" ></script>   
    <script type="text/javascript" src="js/jquery.dataTables.min.js"></script> 
</head> 
<body> 
    //this is the jQuery function for table //     
    <script type="text/javascript"> 
    $(document).ready(function() { 
     $('#tableData').dataTable(); 
    }); 
    </script> 

    // these are the CSS classes that will create the table look and feel 
    <table class="tableData context-menu-one" id="tableData" style="overflow-x: scroll "> 
     <thead> // this is column for tables which will contain the values from the database // 
      <tr style="font-size: 14px;" > 
       <th width="20%" align="left">Name</th> 
       <th width="20%" align="left">Class</th> 
       <th width="20%" align="left">Roll</th> 
       <th width="20%" align="left">Address</th> 
       <th width="20%" align="left">Marks</th> 
      </tr> 
     </thead>  
     // this is table values here we will list some values dynamically which will come from database 
     <tr style="font-size: 14px;" > 
      <th width="20%" align="left">john</th> 
      <th width="20%" align="left">9</th> 
      <th width="20%" align="left">47</th> 
      <th width="20%" align="left">mumbai</th> 
      <th width="20%" align="left">52</th> 
     </tr> 
     <tbody> 
     <tbody> 
     </tbody> 
    </table> 
</body> 
</html> 

有人请帮助我

+0

你把这个溢出应用到了什么地方? –

+0

此外:它可能不是你要求的解决方案,但也许它有一些帮助http://datatables.net/ –

+0

基本上,表没有滚动条... –

回答

1

overflow属性必须在表容器,而不是表本身上应用。

如果滚动条没有出现,那是因为表格宽度小于容器宽度。