Javascript 具有大列和可调整大小列的引导表
我正在使用并希望有一个包含和列的表 当我有更多的列时,水平滚动条被启动。当我想调整列的大小时,由于插件中的css规则Javascript 具有大列和可调整大小列的引导表,javascript,jquery,css,twitter-bootstrap,bootstrap-table,Javascript,Jquery,Css,Twitter Bootstrap,Bootstrap Table,我正在使用并希望有一个包含和列的表 当我有更多的列时,水平滚动条被启动。当我想调整列的大小时,由于插件中的css规则.JColResizer{table layout:fixed;},水平滚动条被破坏 可调整大小的扩展取决于插件和第56行 t.addClass(SIGNATURE).attr(ID,ID).before(“”) in被添加到表(tvariable)JColResizer类(SIGNATUREvariable)中。如果删除此规则,水平滚动条将再次显示,但列的大小不可调整 html
.JColResizer{table layout:fixed;}
,水平滚动条被破坏
可调整大小的扩展取决于插件和第56行
t.addClass(SIGNATURE).attr(ID,ID).before(“”)代码>
in被添加到表(t
variable)JColResizer类(SIGNATURE
variable)中。如果删除此规则,水平滚动条将再次显示,但列的大小不可调整
html
<table class="table table-striped table-bordered table-hover" cellspacing="0" id="mainTable" data-show-toggle="true" data-show-columns="true" data-pagination="true" data-show-filter="true" data-filter-control="true" >
<thead>
<tr>
<th data-field="CustomerName">CustomerN</th>
<th data-field="ProjectName">ProjectN</th>
<th data-field="ProjectType">ProjectT</th>
<th data-field="ProjectDetails">ProjectD</th>
<th data-field="ProjectLocation">ProjectL</th>
<th data-field="ProjectTiming">ProjectT</th>
<th data-field="ProjectTeam">ProjectT</th>
<th data-field="ProjectStatus">ProjectS</th>
<th data-field="ProjectProgress">ProjectP</th>
</tr>
</thead>
<tbody>
<tr>
<td>GE Capital Corporation</td>
<td>Services SOW #1</td>
<td>Project | T&M</td>
<td>"Inani fabulas nominavi sea no.\n"+
"Ad quodsi luptatum expetenda eum, sed ludus dicam\n"+
"nominati te, reque causae prompta eos ex. Putent \n"+
"torquatos mei ei. Te verear offendit per. Vix eu erant\n"+
"doctus delenit, et copiosae indoctum accommodare eum.\n"+
"Errem tritani in qui, te vis legere saperet corpora.\n"+
"Eu mei nobis pertinacia, in has putent virtute voluptua,\n"+
"ne probo dicta utinam nam."
</td>
<td>Norwalk, CT</td>
<td>Feb-Aug 2015</td>
<td>John, Adam, Pete</td>
<td>Running</td>
<td>Empty</td>
</tr>
<tr>
<td>GE Capital Corporation</td>
<td>Services SOW #1</td>
<td>Project | T&M</td>
<td>"Inani fabulas nominavi sea no.\n"+
"Ad quodsi luptatum expetenda eum, sed ludus dicam\n"+
"nominati te, reque causae prompta eos ex. Putent \n"+
"torquatos mei ei. Te verear offendit per. Vix eu erant\n"+
"doctus delenit, et copiosae indoctum accommodare eum.\n"+
"Errem tritani in qui, te vis legere saperet corpora.\n"+
"Eu mei nobis pertinacia, in has putent virtute voluptua,\n"+
"ne probo dicta utinam nam."
</td>
<td>Norwalk, CT</td>
<td>Feb-Aug 2015</td>
<td>John, Adam, Pete</td>
<td>Running</td>
<td>Empty</td>
</tr>
<tr>
<td>GE Capital Corporation</td>
<td>Services SOW #1</td>
<td>Project | T&M</td>
<td>"Inani fabulas nominavi sea no.\n"+
"Ad quodsi luptatum expetenda eum, sed ludus dicam\n"+
"nominati te, reque causae prompta eos ex. Putent \n"+
"torquatos mei ei. Te verear offendit per. Vix eu erant\n"+
"doctus delenit, et copiosae indoctum accommodare eum.\n"+
"Errem tritani in qui, te vis legere saperet corpora.\n"+
"Eu mei nobis pertinacia, in has putent virtute voluptua,\n"+
"ne probo dicta utinam nam."
</td>
<td>Norwalk, CT</td>
<td>Feb-Aug 2015</td>
<td>John, Adam, Pete</td>
<td>Running</td>
<td>Empty</td>
</tr>
</tbody>
</table>
如果添加此css规则
.JColResizer{
table-layout: inherit;
}
水平滚动条已启动,但列的大小不可调整
编辑//
我删除了.JColResizer{table layout:fixed;}
并添加了$(tb).css('table-layout','auto')在begging和$(tb.css('table-layout','fixed')中的code>
在ColResizeble插件中的var init=function(tb,options)
函数末尾。现在它不知怎么起作用了
问题是,现在列的大小不能小于其默认渲染大小(minWidth参数不起作用)
.JColResizer{
table-layout: inherit;
}