Javascript 'Dot Dot Dot' 计算时

Question

我有一个功能可以在生成报告时在弹出窗口中显示点点点。我想显示文本:

正在生成报告。 生成报告.. 正在生成报告...

...重复，直到报告准备好。到目前为止，我只能在弹出窗口中获取三个点，而无法获取其他文本。这是我的代码片段:

on(链接，“点击”，函数(){

          var dots = window.setInterval( function() {
            var wait = document.getElementById("reportLink");
            if ( wait.innerHTML.length > 2) 
                wait.innerHTML = "";
            else 
                wait.innerHTML += ".";
            }, 400);

      domAttr.set(dom.byId("reportLink"), "innerHTML", dots);

我尝试了这个，但没有成功:

domAttr.set(dom.byId("reportLink"), "innerHTML", "Generating Report" + dots);

Answer 1

您传递给 setInterval 的函数直接操作 dom 元素，而不是返回一个值(无论如何都不起作用)，因此您“生成报告”+点 不起作用，因为 dots 只是对 setInterval 函数的引用。相反，您需要使用类似以下内容修改您的 setInterval 函数(未经测试，因为我不确定您正在使用什么 JS 库/框架):

var dots = window.setInterval( function() {
    var wait = document.getElementById("reportLink"),
               msg = "Generating Report",
               msgLen = msg.length;

    // Initialize to msg if blank
    wait.innerHTML = (wait.innerHTML === "") 
        ? msg 
        : wait.innerHTML; 

    if (wait.innerHTML.length >= (msgLen + 2))
        wait.innerHTML = msg;
    else 
        wait.innerHTML += ".";
}, 400);

这使用您想要显示的实际消息，而不是通过空字符串初始化和测试您的消息。我还通过变量配置了点数，而不是使用 "magic number" .

[编辑1] 确保删除此行(以及任何衍生物): domAttr.set(dom.byId("reportLink"), "innerHTML", 点);

您传递给 setInterval 的函数正在完成所有工作。

[编辑 2:如果 reportLink 元素为空，则通过初始化为 msg 修复首次运行时的过多点。]