javascript - 排序表时如何触发跨度元素
问题描述
为了根据文件的大小对表格进行排序,我使用以下代码:
// table sort
$(document).on('click','th',function() {
var table = $(this).parents('table').eq(0)
var rows = table.find('tr:gt(0)').toArray().sort(comparer($(this).index()))
this.asc = !this.asc
if (!this.asc){rows = rows.reverse()}
for (var i = 0; i < rows.length; i++){table.append(rows[i])}
})
function comparer(index) {
return function(a, b) {
var valA = getCellValue(a, index), valB = getCellValue(b, index)
return $.isNumeric(valA) && $.isNumeric(valB) ? valA - valB : valA.toString().localeCompare(valB)
}
}
function getCellValue(row, index){ return $(row).children('td').eq(index).text() }
带有 的行td
如下所示:
<!-- SIZE-->
<td class="td-size table-data">
<!-- raw size for sorting only-->
<span class="sort-only hide">
<?php echo filesize($dir . '/' . $file); ?>
</span>
<?php
echo sizeFormat(recursive_directory_size($dir . '/' . $file);
?>
</td>
元素之间的值span
是原始值(我想用于排序)。
如何在 javascript 中的span
元素上触发?tr
因为现在它只对td
. 它应该只在span
里面td
解决方案
也许如果你调整你getCellValue
的检查span
它会起作用:
function getCellValue(row, index) {
let $td = $(row).children('td').eq(index),
$span = $td.find('span.sort-only');
if ($span.length) { // If span.sort-only was found
return $span.text();
}
else { // If not
return $td.text();
};
}
推荐阅读
- c# - 使用 ClosedXML 无法将 DateTime 导出到 Excel:dd/MM/yyyy HH:mm:ss 被截断为 dd/MM/yyyy
- sql - 非 Azure SQL 版本是否支持 CI/CD SQL 管道?
- segmentation-fault - 如何在实现 dijkstra 算法时克服分段错误?
- python - Python 3d 绘图集固定色标
- pexpect - 忽略预期响应中的 ANSI 颜色
- ios - 自定义 NSURLProtocol 不会调用 canInitWithRequest:
- aws-api-gateway - API Gateway HTTP 集成,如何传递授权标头?
- html - 如何突出显示文本并更改css中的高度和位置?
- c++ - 函数 display() 没有给出输出
- css - 模式打开时更改背景的不透明度(Bootstrap 4)