Question

此流星客户端代码尝试在进度条的中心设置文本，但文本未显示在屏幕上，尽管它显示在检查面板中。试过Chrome和Safari无济于事。有任何建议如何解决这个问题？ THX

lib = (function () {
  return Object.freeze({
    'clickInfo': function () {
        Meteor.setTimeout(function () {
          let bar = document.getElementById('bar');
          bar.style.visibility = 'visible';
          lib.progressBarStart(bar);
        }, 50);

    },
    'progressBarStart': function (bar) {
      if (bar && bar.value < 70) {
        if (Session.get('inProgress')) {
          setTimeout(function () {
            bar = document.getElementById('bar'); 
            lib.progressBarStart(bar);
          }, 1000);
          bar.value += 1;
        }
      } else if (Session.get('inProgress')) {
        bar.innerHTML = 'Result will be emailed'; // <== text failed to show
      }
    }
  });
}());

#bar {
    width: 100%;
    height: 1.5rem;
    visibility: hidden;
    text-align: center;
    color: white;
    -webkit-appearance: none;
    -moz-appearance: none;
}

<progress id="bar" value="0" max="70"></progress>

Answer 1

进度条不应显示任何文字。我建议添加另一个元素（例如<div>）并将其显示在进度条的位置（或顶部）。

进度条文字没有显示

1 个答案: