Js制作点击输入框时默认文字消失的效果

要实现点击输入框时默认文字消失的效果，可以使用JS来监听输入框的点击事件，并且在输入框被点击时，将输入框文本内容设置为空，从而达到在点击输入框时默认文字消失的效果。

下面是实现点击输入框时默认文字消失的步骤：

1. 为需要实现该效果的输入框设置一个默认值，例如“请输入内容…”。

<input type="text" value="请输入内容…" id="input"/>

1. 在JS文件中定义一个函数，使用事件监听器来监听输入框的点击事件，并在点击事件发生时将输入框内的内容清空。

function clearInput() {
    var input = document.getElementById("input");
    input.value = "";
}

// 监听输入框的点击事件
var input = document.getElementById("input");
input.addEventListener("click", clearInput);

1. 运行页面，当在输入框内点击时，输入框内的默认内容会消失。

下面是另一种实现点击输入框时默认文字消失效果的方法，使用了HTML5的placeholder属性。

1.在HTML中设置placeholder属性

<input type="text" placeholder="请输入内容..." id="input">

1. 页面加载完成后，查找输入框并使用JS来指定placeholder属性。

window.onload = function() {
    var input = document.getElementById("input");
    input.setAttribute("placeholder", "请输入内容...");
};

这种方法也可以实现点击输入框时默认文字消失，但是不需要在JS中使用事件监听器，使用起来更为简单。