Javascript 如何在退出搜索框事件时重置占位符?

Javascript 如何在退出搜索框事件时重置占位符?,javascript,html,css,Javascript,Html,Css,我有一个覆盖搜索框的复选代码。搜索框中有一个占位符Sök,比如说用户在文本框中写了一些东西,然后按右上角的x退出。然后我希望删除用户写入的文本,并重置占位符,这样每当用户再次进入搜索框时,文本将被删除,占位符将返回。如何创建此事件? 代码: 身体{ 背景:白色; 字体系列:“蒙特塞拉特”,无衬线; 垫底:-1px; } 跨度{ 显示:内联块; } .背景标志{ 利润上限:-1400px; z指数:-1; 位置:相对位置; 宽度:100%; } .集装箱{ 宽度:80%; 保证金:0自动; }

我有一个覆盖搜索框的复选代码。搜索框中有一个占位符Sök,比如说用户在文本框中写了一些东西,然后按右上角的x退出。然后我希望删除用户写入的文本,并重置占位符,这样每当用户再次进入搜索框时,文本将被删除,占位符将返回。如何创建此事件? 代码:

身体{ 背景:白色; 字体系列:“蒙特塞拉特”,无衬线; 垫底:-1px; } 跨度{ 显示:内联块; } .背景标志{ 利润上限:-1400px; z指数:-1; 位置:相对位置; 宽度:100%; } .集装箱{ 宽度:80%; 保证金:0自动; } 标题{ 背景:无; } * { 保证金:0; 填充:0; } 标题::之后{ 内容:; 显示:表格; 明确:两者皆有; } 导航{ 浮动:对; 右侧填充:230px; } 李海军{ 显示:内联块; 左侧填充:45px; 填充顶部:20px; 垫底:20px; } 导航ul{ 列表样式:无; 显示:内联块; 填充顶部:25px; } 导航a{ 字体大小:12px; 颜色:黑色; 字号:600; 文字装饰:无; 文本对齐:居中; 文本转换:大写; } 导航a:悬停{ 颜色:红色; } 李导航:悬停{ } .fa酒吧{ 颜色:黑色; 字体大小:14px; 左侧填充:15px; } .fa条:悬停{ 颜色:红色; 光标:指针; } .包装纸{ 位置:相对位置; 身高:100%; 宽度:100%; } .背景标志{ } 图1{ 高度:350px; 宽度:600px; 边缘顶部:100px; 左边距:80px; 位置:绝对位置; z指数:4; 背景图片:url'Img/KBA.jpg'; 背景位置:10%30%; 背景大小:180%; } 比尔先生2{ 高度:350px; 宽度:600px; 边缘顶部:140px; 左边距:120像素; z指数:3; 位置:绝对位置; 背景色:3D6BB8; } .entrytext{ 浮动:对; 右边距:90像素; 边缘顶端:175px; 明确:两者皆有; } .entrytext>h1{ 字号:800; 字体风格:普通; 字体大小:54px; } .entrytext>按钮{ 边界:无; 显示:内联块; 背景色:38b272; 颜色:白色; 填充:8px 10px 8px 15px; 字母间距:6px; 边界半径:8px; 字号:500; 字号:17px; 文本对齐:左对齐; 边缘顶部:20px; 盒影:20px 15px黑色; } .entrytext>按钮:悬停{ 边界:无; 显示:内联块; 背景色:c12147; 颜色:白色; 填充:8px 10px 8px 15px; 字母间距:6px; 边界半径:8px; 字号:500; 字号:17px; 文本对齐:左对齐; 边缘顶部:20px; } 按钮:焦点{大纲:0;} .fa右角{ 字体大小:20px; 左侧填充:30px; } .entrytext>h2{ 字体大小:14px; 字号:600; 边缘顶部:20px; } 城市加利里亚酒店{ 颜色:CC2244; } .品牌{ 高度:110px; 宽度:750px; 利润率:600px自动; 背景色:CFCFCF; 明确:两者皆有; z指数:11; } .openBtn{ 背景:f1f1; 边界:无; 填充:10px 15px; 字体大小:20px; 光标:指针; } .openBtn:悬停{ 背景:bbb; } .覆盖{ 身高:100%; 宽度:100%; 显示:无; 位置:固定; z指数:10; 排名:0; 左:0; 背景色:白色; 背景色:RGBA255255,0.8; } .覆盖内容{ 位置:相对位置; 最高:20%; 宽度:80%; 文本对齐:居中; 边缘顶部:30px; 保证金:自动; } .overlay.closebtn{ 位置:绝对位置; 顶部:20px; 右:45px; 字体大小:60px; 光标:指针; 颜色:黑色; } .overlay.closebtn:悬停{ 颜色:ccc; } .overlay输入[类型=文本]{ 填充:15px; 字体大小:50px; 字体大小:粗体; 边界:无; 背景:无; 保证金:0自动; 文字装饰:无; 边框底部:6px纯黑; 边框左下半径:5px; 颜色:黑色; 文本对齐:居中; 宽度:100%; } 输入::占位符{ 颜色:黑色; } .overlay输入[类型=文本]:悬停{ 背景:无; } .覆盖按钮{ 浮动:左; 宽度:20%; 填充:15px; 背景:ddd; 字号:17px; 边界:无; 光标:指针; } 输入:焦点{大纲:0;} .覆盖按钮:悬停{ 背景:bbb; } .type1{ 宽度:1700px; } Kungsmässan-Måste upplevas! × 函数openSearch{ document.getElementByIdmyOverlay.style.display=块; } addEventListener'keydown',函数{document.getElementById'type2'。focus;}; 函数关闭搜索{ document.getElementByIdmyOverlay.style.display=none; } Sveriges bästa citygalleria。Mitt i Kungsbacka。 35000 kVA电能表OCHÖVER 100 AFFÄRER! LÄS MER
如果在单击“关闭”按钮时将输入值设置为“无”,则占位符应再次出现:

const button=document.querySelector“button”; 常量输入=document.querySelector“input”; button.addEventListener“单击”,事件=>{ input.value=; };
关闭尝试使用setValue方法重置任何元素值。

我是Java初学者 克瑞特,你能给我看整行吗?