Javascript Jquery根据标题值更改列位置
单击按钮时,我希望根据标题值更改列位置。也就是说,我想根据标题值对表列位置进行排序。标题值是日期。jquery中有简单的解决方案吗?或者任何一个引用任何其他解决方案 htmlJavascript Jquery根据标题值更改列位置,javascript,jquery,Javascript,Jquery,单击按钮时,我希望根据标题值更改列位置。也就是说,我想根据标题值对表列位置进行排序。标题值是日期。jquery中有简单的解决方案吗?或者任何一个引用任何其他解决方案 html HE2018-05-232018-05-232018-05-242018-05-252018-06-012018-05-30 7. 23.4 23.423.423.423.4 8. -2023.4-20-20-20-20 您可以执行以下操作: var headers=$('#time_date th').map(
HE2018-05-232018-05-232018-05-242018-05-252018-06-012018-05-30
7.
23.4 23.423.423.423.4
8.
-2023.4-20-20-20-20
您可以执行以下操作:
var headers=$('#time_date th').map(函数(i){
如果(i>0)返回{index:i,值:$(this.html()};
})。排序(函数(a、b){
返回a.value>b.value?1:a.value==b.value?0:-1
})得到
函数排序器(){
$('tr')。每个(功能(i){
如果(i==0){
$(this).children('th')。每个(函数(i){
if(i>0)$(this).html(头[i-1].value)
} )
}否则{
变量temp=[],temp2=[];
$(此)。每个(函数(){
temp=$(this.children('td').toArray();
对于(变量i=0;i
表格{
字体系列:“投石机MS”,Arial;
边界塌陷:塌陷;
文本对齐:居中;
宽度:100%
}
td,th{
边框:1px实心#ddd;
填充:8px
}
tr:n个孩子(偶数){
背景色:#F2F2
}
tr:悬停{
背景色:#ddd
}
th{
填充:15px0;
背景色:#87bdd8;
颜色:白色
}
更改收割台位置
他
2018-05-23
第一栏
2018-05-25
第2栏
2018-05-23
第3栏
2018-05-24
第4栏
2018-06-01
第5栏
2018-05-30
第6栏
7.
第1栏
第2栏
第3栏
第4栏
第5栏
第6栏
8.
第1栏
第2栏
第3栏
第4栏
第5栏
第6栏
9
第1栏
第2栏
第3栏
第4栏
第5栏
第6栏
10
第1栏
第2栏
第3栏
第4栏
第5栏
第6栏
能否提供与此问题相关的html
<table class="table table-bordered table-sm" id="tutorial">
<tbody>
<tr id="time_date">
<th>HE</th><th class="remove_head6">2018-05-23</th><th class="remove_head-65" >2018-05-23</th><th class="remove_head-54" >2018-05-24</th><th class="remove_head-91" >2018-05-25</th><th class="remove_head22" >2018-06-01</th><th class="remove_head9" >2018-05-30</th></tr>
<tr id="tr7">
<td>7</td>
<td class="valid_cls remove_head6" >23.4</td><td class="remove_head-65"> </td><td class="valid_cls remove_head-54">23.4</td><td class="valid_cls remove_head-91">23.4</td><td class="valid_cls remove_head22" >23.4</td><td class="valid_cls remove_head9" >23.4</td></tr>
<tr id="tr8">
<td>8</td>
<td class="valid_cls remove_head6" >-20</td><td class="valid_cls remove_head-65" >23.4</td><td class="valid_cls remove_head-54" >-20</td><td class="valid_cls remove_head-91" >-20</td><td class="valid_cls remove_head22" >-20</td><td class="valid_cls remove_head9" >-20</td></tr>
<tr id="tr9">
</tbody></table>