input文本框中的placeholder属性进行来回切换

Question

请问用HBuilder X,怎么实现文本框的placeholder值隔2秒自动切换

Answer 1

首先，在HTML文件中创建一个文本框，添加一个id属性，以便在JavaScript中引用它。例如：

<input type="text" id="myInput" placeholder="Placeholder 1">

接下来，在JavaScript文件中创建一个数组来存储所有可能的placeholder值，然后设置一个计数器变量，用于追踪当前显示的placeholder值。例如：

var placeholders = ["Placeholder 1", "Placeholder 2", "Placeholder 3"];
var count = 0;

然后，使用JavaScript代码为文本框添加一个事件监听器，以便在单击文本框时更改placeholder值。例如：

var myInput = document.getElementById("myInput");
myInput.addEventListener("click", function() {
    count++;
    if (count >= placeholders.length) {
        count = 0;
    }
    myInput.placeholder = placeholders[count];
});

这段代码将计数器增加1，然后检查计数器是否超出了placeholder数组的长度。如果是，则将计数器重置为0。最后，将文本框的placeholder属性设置为数组中当前位置的值。

最后，保存并运行您的代码。当您单击文本框时，它将切换到下一个placeholder值，并循环回到第一个值。