Question

这里有一个动态创建JS的表，它包含的数据比屏幕显示的更多，所以我需要实现滚动功能，主要的是我还需要表格宽度为100％ 。请有人吗？

var table = $('#mydemo1');
 	        
            for (var i = 0; i <= result.length; i++) 
            {
            	doc1=result[i];
            	                 
                 var tbody = $("<tbody>").appendTo(table);
                 var tr = $("<tr>").appendTo(tbody);
		         var td = $("<td>").html(doc1.Name).data(doc1).appendTo(tr);   

            }

  .mytdemo1 td{font-family:Arial, sans-serif;font-size:14px;padding:10px 7px;border-style:solid;border-width:0px;overflow:hidden;word-break:normal;border-color:red;color:#444;background-color:#F7FDFA;}
.mytdemo1 td:hover {
	cursor:pointer;
      color: #ccc;
   }
.mytdemo1 th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:10px 7px;border-style:solid;border-width:0px;overflow:hidden;word-break:normal;border-color:red;color:#fff;background-color:#26ADE4;}
.mytdemo1 .mytdemo1-yw4l{vertical-align:top}

<div class="empl" id="table-scroll"> 
 	
	<table class="mytdemo1" id="mydemo1" style="display:none;"> 
	<thead>
	<tr><th>Employee Name</th></tr>
	</thead>
	
	</table> 
	
	</div>

Answer 1

您应该尝试在表的父元素（可能是div）中设置以下样式：

/* style to table's parent */
overflow: auto;
width: 100%;
max-height: /* your desired height */

表格中的这种风格：

width: inherit;

Answer 2

如果我找到了你，你想滚动而没有滚动条在侧面固定的位置。

使用：

.vertically_scrollable{  
    overflow-x:hidden;
    overflow-y:auto;
}

因为它只会在必要时显示垂直滚动条。

使用js创建的表的滚动功能

2 个答案: