使用jQuery.countdown与moment.js实现多时区倒计时时时区失效问题

看起来你遇到的核心问题是：明明用moment.tz指定了时区，但jQuery.countdown插件还是固执地用GMT/UTC时间计算倒计时。这其实是两个工具对时间的处理逻辑差异导致的，我来给你拆解原因和解决方案：

问题根源 #

jQuery.countdown默认是基于浏览器本地时区来处理传入的Date对象的，而moment.tz生成的时间转成toDate()后，本质上是一个UTC时间戳的包装。当countdown拿到这个Date对象时，会自动转成浏览器本地时区的时间来计算，这就导致你设置的时区被直接忽略了。另外还要注意：如果你的data-countdown属性里的时间字符串本身带时区标记（比如2024-12-31T23:59:59Z），moment.tz会优先使用字符串里的时区，直接无视你传入的America/Los_Angeles参数。

解决方案一：让countdown使用UTC模式 #

你可以把目标时区的时间转成对应的UTC时间，然后开启countdown的utc选项，让插件基于UTC时间计算，这样就能和你指定的时区保持一致：

$(function(){
  $('[data-countdown]').each(function() {
    var $this = $(this);
    // 获取页面上的目标时间字符串
    var targetTimeStr = $this.data('countdown');
    // 解析为洛杉矶时区的时间（确保字符串不带时区标记）
    var targetLaTime = moment.tz(targetTimeStr, 'America/Los_Angeles');
    // 转成UTC时间的Date对象
    var targetUtcDate = targetLaTime.utc().toDate();
    
    // 初始化countdown，开启UTC模式
    $this.countdown(targetUtcDate, function(event) {
      // 这里的格式化可以根据你的需求调整
      $(this).html(event.strftime('%D days %H:%M:%S'));
    }).countdown('option', 'utc', true);
  });
});

解决方案二：完全用moment.js处理倒计时（更可靠） #

如果不想依赖countdown插件的时区逻辑，直接用moment来实时计算剩余时间，这样能彻底避免时区冲突：

$(function(){
  $('[data-countdown]').each(function() {
    var $this = $(this);
    var targetTimeStr = $this.data('countdown');
    // 解析为目标时区的时间
    var targetMoment = moment.tz(targetTimeStr, 'America/Los_Angeles');
    
    // 每秒更新一次倒计时
    var timer = setInterval(function() {
      // 获取当前目标时区的时间
      var now = moment.tz('America/Los_Angeles');
      // 计算时间差（毫秒）
      var timeDiff = targetMoment.diff(now);
      
      // 倒计时结束时停止定时器
      if (timeDiff <= 0) {
        clearInterval(timer);
        $this.html('倒计时结束');
        return;
      }
      
      // 格式化剩余时间
      var duration = moment.duration(timeDiff);
      var displayText = `${duration.days()} days ${duration.hours()}:${
        duration.minutes().toString().padStart(2, '0')
      }:${duration.seconds().toString().padStart(2, '0')}`;
      
      $this.html(displayText);
    }, 1000);
  });
});

额外注意事项 #

• 确保你已经引入了完整的moment-timezone包（包含时区数据），如果只引入了moment.js，moment.tz是无法正常工作的，会默认使用本地时间。
• 检查data-countdown的时间格式：尽量使用不带时区标记的字符串（比如2024-12-31 23:59:59），这样moment.tz才会用你指定的时区来解析。

内容的提问来源于stack exchange，提问作者R.J. L