JS事件：https://www.w3school.com.cn/jsref/jsref_events.asp
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .gray { color: #808080; } .black { color: #000; } </style> <script> window.onload = function () { //当文本框获得焦点 如果文本框内容为请输入关键字 清空文本框内容 并让字体呈黑色 var txtSearch = document.getElementById(‘txtSearch‘); // 在事件处理函数中，this代表触发该函数的对象 txtSearch.onfocus = function () { if (this.value === ‘请输入关键字‘) { this.value = ‘‘; this.className = ‘black‘; } } // 当文本框失去焦点 如果文本框内容为空 还原文本框内容 字体呈灰色 txtSearch.onblur = function () { if (this.value.length === 0 || this.value === ‘请输入关键字‘) { this.value = ‘请输入关键字‘; this.className = ‘gary‘; } } } </script> </head> <body> <input type="text" name="" id="txtSearch" value="请输入关键字" class="gray"> <input type="button" value="搜索"> </body> </html>