You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Razor视图调用JS函数返回值无法在表格中显示的问题

出错原因

核心问题有两个:

  • 你在<td>内嵌的脚本中仅调用了转换函数,没有将函数返回值写入页面DOM。浏览器不会自动把脚本的return结果插入到文档流中,这就是控制台能看到转换日志、但单元格为空的直接原因。
  • 你手动拼接的MM/dd/yyyy hh:mm:ss tt UTC日期字符串存在跨浏览器解析兼容问题,部分WebKit内核浏览器(比如Safari)无法正确识别这种自定义格式,会直接返回无效日期。
修复方法

优先推荐无侵入的统一渲染方案,避免在每个单元格重复嵌入脚本,也规避document.write的潜在副作用:

  1. 给需要显示本地时间的单元格加统一类名,通过data-*属性存储标准格式的UTC时间,不要手动拼接时间字符串:
@foreach (var member in Model.Items)
{
    <tr>
        <!-- 其他表格列 -->
        <td class="local-date-cell" data-utc="@member.CreatedDate.ToString("o")"></td>
    </tr>
}

说明:.ToString("o")会输出符合ISO 8601标准的UTC时间字符串(末尾带Z时区标识),所有现代浏览器的JS引擎都能稳定解析,不存在兼容问题。

  1. 在页面底部加一段统一处理的脚本,DOM加载完成后自动遍历所有时间单元格,转换为本地时间后写入单元格内容:
document.addEventListener('DOMContentLoaded', function() {
    // 遍历所有需要转换时间的单元格
    document.querySelectorAll('.local-date-cell').forEach(function(cell) {
        const utcTime = cell.getAttribute('data-utc');
        const localDate = new Date(utcTime);
        // 可根据需要调整时间显示格式,比如toLocaleString、toLocaleDateString等
        cell.textContent = localDate.toLocaleString();
    })
})

如果想要快速修复现有代码不想改结构,也可以直接在原有脚本调用处用document.write把返回值输出到当前位置,同时替换时间格式化方式:

<td>
    <script>
        // 替换原有仅调用函数的写法,直接输出结果到页面
        document.write(GetLocalDateTime('@member.CreatedDate.ToString("o")'));
    </script>
</td>

这种写法虽然能快速生效,但因为document.write在页面加载完成后执行会覆盖整个文档,不推荐在复杂页面使用。

内容的提问来源于stack exchange,提问作者Steven

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.03 00:09:38