更改文本框中文本的 SetTimeout 函数答案

【问题标题】：SetTimout function that changes text in a textbox更改文本框中文本的 SetTimeout 函数
【发布时间】：2011-11-02 14:44:25
【问题描述】：

这是我使用 javascript 做任何事情的第二天，所以我是一个完整的初学者。正如标题所述，我只想使用 settimeout 函数更改文本框的文本值。我已经搜索了互联网并走到了死胡同。这是我目前所拥有的，

    putftp.onclick = function () {
    var Text = document.getElementById("TextBox");


    function firsttext() {
       document.getElementbyID("TextBox").innerHTML = "This is the first test.";
       setTimeout("secondtest()",3000);
    }
    function secondtest() {
        document.getElementById("TextBox").innerHTML = "This is the second test.";
        setTimeout("thirdtest()",5000);
    }
   function thirdtest() {
        document.getElementById("TextBox").innerHTML = "This is the last test.";
    }
};

我不确定我是否使用了正确的格式，或者我什至是否接近正确。我很确定一切都很好，除了 document.getElementbyID("textbox").innerHTML 部分。我认为那里会有所改变，但这只是我的第二天，所以我真的可能对整个问题一无所知。提前感谢您的帮助！

【问题讨论】：

对于所有回答的人，innerHTML不会改变文本框的值>_>。它的.value = 'text'
@f0x 谢谢，在构建测试用例时注意到了这一点。 :)

标签： javascript asp.net visual-studio textbox settimeout

【解决方案1】：

要在单击按钮 3 秒后更改一次文本，请执行以下操作：

putftp.onclick = function () {
    window.setTimeout(function() {
       document.getElementById("TextBox").value = "This is the first test.";
    }, 3000);
};

我为您修复的原始代码中有两个错误：

假设TextBox是一个文本框，你需要分配它的value属性，而不是innerHTML。
正确的名称是getElementById 而不是getElementbyID。 JavaScript 区分大小写。

要在两秒后再次更改，可以添加“嵌套”计时器：

putftp.onclick = function () {
    window.setTimeout(function() {
       document.getElementById("TextBox").value = "This is the first test.";
       window.setTimeout(function() {
           document.getElementById("TextBox").value= "This is the second test.";
        }, 2000);
    }, 3000);
};

Live test case.

【讨论】：

当然，这就是我们来这里的目的。 :-)

【解决方案2】：

您发布的代码的明显问题是您没有调用firsttest()-function。因此，永远不会对 setTimeout 进行第一次调用。此外，您可以通过传递函数本身来增强您的脚本，如下所示：setTimeout(secondtest, 3000);

其次，既然你已经得到了一次元素，为什么不通过删除一些 getElementById:s 来缩短代码。

putftp.onclick = function () {
    var Text = document.getElementById("TextBox");

    function firsttext() {
        Text.innerHTML = "This is the first test.";
        setTimeout(secondtest, 3000);
    }
    function secondtest() {
         Text.innerHTML = "This is the second test.";
         setTimeout(thirdtest, 5000);
    }
    function thirdtest() {
         Text.innerHTML = "This is the last test.";
    }

    firsttext();
};

【讨论】：

+1 更多教我调用第一个函数。谢谢大佬

【解决方案3】：

函数在执行时没有定义，因为传递一个字符串会导致它在全局范围内运行。这些函数仅在 onclick 处理程序中定义。

你应该只传递函数本身，而不是传递字符串。另外，为什么不实际使用Text 变量呢？你应该通过执行第一个函数来开始这个过程。

顺便说一句，您对text 和test 的命名不是很好；很容易被误读。

putftp.onclick = function () {
    var Text = document.getElementById("TextBox");

    firsttext(); // start process

    function firsttext() {
       Text.innerHTML = "This is the first test.";
       setTimeout(secondtest, 3000);
    }

    function secondtest() {
        Text.innerHTML = "This is the second test.";
        setTimeout(thirdtest, 5000);
    }

    function thirdtest() {
        Text.innerHTML = "This is the last test.";
    }
};

【讨论】：