鸿蒙开发者社区

WOT技术大会

公众号矩阵

移动端

视频课免费课排行榜短视频直播课软考学堂

全部课程软考华为认证厂商认证 IT技术 PMP项目管理免费题库

文章资源问答课堂专栏直播

51CTO

鸿蒙开发者社区

51CTO技术栈

51CTO官微

51CTO学堂

51CTO博客

CTO训练营

鸿蒙开发者社区订阅号

51CTO软考

51CTO学堂APP

51CTO学堂企业版APP

鸿蒙开发者社区视频号

51CTO软考题库

鸿蒙开发者社区

登录/注册
51CTO

中国优质的IT技术网站

51CTO博客

专业IT技术创作平台

51CTO学堂

IT职业在线教育平台

活动短视频专栏极客Show 鸿蒙技术特刊

js如何清空一个input 输入框的内容

<input id="userName" onchange="inputChange" value="{{form.userName}}"/>
this.$element("userName").attr.value = '' //没用
htis.form.userName = '' //没用

鸿蒙

HarmonyOS

JavaScript

2021-11-19 11:52:01

浏览

赞

收藏 0

回答 2

回答 2

按赞同

/

按时间

1

可以使用this.form.userName =“”

回复

2021-11-19 15:31:04

this.$element("userName").attr.value = ''：此代码中this.$element 并非原生 JavaScript 方法，不清楚其具体实现逻辑。就算它能选中元素，attr 这样的访问方式也不对，在原生 JavaScript 里应直接操作 DOM 元素的属性。
htis.form.userName = ''：代码里htis 拼写有误，正确的应该是this。另外，this.form 不清楚是什么，若想操作输入框，需要先选中该 DOM 元素。

你可以借助原生 JavaScript 选中输入框元素，再把它的 value 属性设为空字符串

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
</head>

<body>
    <input id="userName" onchange="inputChange()" value="初始值">
    <button onclick="clearInput()">清空输入框</button>
    <script>
        function clearInput() {
            const input = document.getElementById('userName');
            input.value = '';
        }

        function inputChange() {
            // 处理输入框内容变化的逻辑
            console.log('输入框内容发生变化');
        }
    </script>
</body>

</html>1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.

document.getElementById('userName')：该方法用于选中id 为userName 的输入框元素。
input.value = ''：将选中的输入框元素的value 属性设为空字符串，从而清空输入框内容。

回复

2025-03-23 13:16:41

如何写精华回答，获更多曝光？

发布

相关问题

如何清空文本输入框的内容

1835浏览 • 2回复待解决

HarmonyOS textInput 如何清空输入框

940浏览 • 2回复待解决

TextInput组件如何清空输入框内输入的内容

1602浏览 • 3回复待解决

HarmonyOS 一个page有多个TextInput，如何从第一个输入框将光标切换到下一个输入框

765浏览 • 1回复待解决

获取输入框输入的内容

505浏览 • 2回复待解决

#鸿蒙学习大百科#如何实现一个输入密码的输入框？

1464浏览 • 1回复待解决

HarmonyOS 弹出一个自定义弹窗，里面包含一个多行输入框，怎么让弹窗弹出的时候，输入框自动获取焦点？

1049浏览 • 1回复待解决

HarmonyOS 输入框不显示内容

1024浏览 • 2回复待解决

HarmonyOS web组件强占输入框焦点，导致输入框光标闪烁但无法输入内容

816浏览 • 1回复待解决

HarmonyOS 请问如何令一个输入框自动失焦，并自动收起键盘

684浏览 • 1回复待解决

HarmonyOS dialog上有个输入框，点击输入框键盘会将dialog顶出屏幕

858浏览 • 1回复待解决

HarmonyOS TextInput的text属性包含“�”时，输入框内容被异常清空

664浏览 • 1回复待解决

HarmonyOS 输入框回车时，如果输入框内容为空，键盘不收起

1003浏览 • 1回复待解决

HarmonyOS 当点击输入框进行输入时，输入框未被键盘顶起

819浏览 • 2回复待解决

鸿蒙pad的input输入框，无法响应ctrl+c、ctrl+x事件

7253浏览 • 1回复待解决

验证码输入框布局，行布局，一个空间宽度固定，另一个空间撑满，怎么做？

743浏览 • 1回复待解决

HarmonyOS 密码输入框

799浏览 • 1回复待解决

HarmonyOS 一个文本输入框，如何只能确保只能输入数字，并且每4位数字间用空格隔开？

1249浏览 • 1回复待解决

HarmonyOS input框体验较差，希望点击非输入框区域，取消聚焦，收起键盘

996浏览 • 1回复待解决

TextInput输入框如何失去焦点？输入框获取焦点后，点击页面上其他任意地方无法失去焦点，焦点在输入框中

3246浏览 • 1回复待解决

HarmonyOS 适配-输入框问题

843浏览 • 1回复待解决

HarmonyOS 输入框无法对齐

1158浏览 • 1回复待解决

HarmonyOS 有无短信验证码输入框和交易密码输入框组件

843浏览 • 1回复待解决

HarmonyOS 键盘遮挡输入框

736浏览 • 1回复待解决

HarmonyOS 修改输入框焦点

746浏览 • 1回复待解决

提问

该提问已有0人参与，帮助了0人

相关讨论帖

TextField获取输入框内容/TextField基础操作/输入框获取输入内容 0回复

input框无法输入 1回复

input 框无法输入 6回复

element输入框限制 2回复

如何自定义输入框样式（TextInput） 1回复

Copyright © 2005-2025 51CTO.COM 京ICP证060544版权所有未经许可请勿转载