讲师中心 微信公众号
首页
文章
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 自媒体 新闻
专题
后端开发 web前端 数据库 开发工具 php框架 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 新闻
AI工具
AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令
学习
大前端 后端开发 数据库 移动端 运维开发 计算机基础
编程手册
大前端 后端开发 数据库 移动端 运维开发 计算机基础
下载
js特效 网站源码 工具下载 类库下载 网站素材 学习资源 插件扩展 手机游戏
最近更新
首页 > web前端 > js教程 > 正文

js清空表单数据的两种方式(遍历+reset)_javascript技巧

php中文网
发布： 2016-05-16 16:41:34
原创
2200人浏览过

方法1：遍历页面元素

/*
清空FORM表单内容 id：表单ID*/ 
function ClearForm(id) {
var objId = document.getElementById(id);
if (objId == undefined) {
return;
}
for (var i = 0; i < objId.elements.length; i++) {
if (objId.elements[i].type == "text") {
objId.elements[i].value = "";
}
else if (objId.elements[i].type == "password") {
objId.elements[i].value = "";
}
else if (objId.elements[i].type == "radio") {
objId.elements[i].checked = false;
}
else if (objId.elements[i].type == "checkbox") {
objId.elements[i].checked = false;
}
else if (objId.elements[i].type == "select-one") {
objId.elements[i].options[0].selected = true;
}
else if (objId.elements[i].type == "select-multiple") {
for (var j = 0; j < objId.elements[i].options.length; j++) {
objId.elements[i].options[j].selected = false;
}
}
else if (objId.elements[i].type == "textarea") {
objId.elements[i].value = "";
}
//else if (objId.elements[i].type == "file") {
// //objId.elements[i].select();
// //document.selection.clear();
// // for IE, Opera, Safari, Chrome
// var file = objId.elements[i];
// if (file.outerHTML) {
// file.outerHTML = file.outerHTML;
// } else {
// file.value = ""; // FF(包括3.5)
// }
//}
}
}
登录后复制

方法2：使用 reset 按钮

页面中增加

西语写作助手
西语写作助手

西语助手旗下的AI智能写作平台，支持西语语法纠错润色、论文批改写作

西语写作助手 21
查看详情 西语写作助手 
<!--用来清空表单数据-->
<input type="reset" name="reset" style="display: none;" />
登录后复制

触发 reset 事件

$("input[type=reset]").trigger("click");
登录后复制

大家都在看：

java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习？java怎么入门？java在哪学？java怎么学才快？不用担心，这里为大家提供了java速学教程(入门到精通)，有需要的小伙伴保存下载就能学习啦！

下载
来源：php中文网
收藏 点赞
上一篇：JQuery中$(document)是什么意思有什么作用_jquery 下一篇：jQuery新的事件绑定机制on()示例应用_jquery
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
最新问题
javascript闭包如何理解_闭包在实际开发中有什么用途 闭包是函数记住并访问其定义时词法环境的能力，核心在于函数作为值、词法作用域与引用保持；可实现私有变量、解决循环异步bug、柯里化等。
2025-12-20 10:09:26
128
javascript中的Cookie是什么_如何安全地使用它 Cookie是HTTP协议的一部分，由服务器通过Set-Cookie下发、浏览器自动存取，最大约4KB；JavaScript仅能通过document.cookie操作非HttpOnlyCookie，本质为字符串操作，需注意编码、路径、域名、Secure及安全配置。
2025-12-20 10:06:07
717
javascript如何检测数据类型_ typeof怎么用 typeof无法准确区分null、数组、日期等对象类型，需配合Object.prototype.toString.call()或Array.isArray等方法；其返回值包括"number"、"string"、"boolean"、"undefined"、"function"、"symbol"、"bigint"及统一的"object"。
2025-12-20 10:01:02
785
javascript如何实现继承_ES6的class与原型继承有什么区别？ ES6的class是原型继承的语法糖，本质未改变继承机制，仍依赖原型链；通过extends和super实现继承，而ES5需手动操作prototype和constructor；两者底层结构一致，但class写法更清晰、可读性更高。
2025-12-20 09:50:39
845
JavaScript如何创建Web Workers？ JavaScript中创建WebWorkers需通过Worker构造函数加载独立JS文件，主线程与Worker通过postMessage/onmessage通信，不可访问DOM或共享变量；Worker脚本须为外部文件，支持模块化（type:‘module’），但受限于同源策略、无DOM访问、需HTTP环境等。
2025-12-20 09:45:38
176
javascript数组有哪些常用方法_如何实现数组去重和排序？ JavaScript数组常用方法分不改变原数组（如map、filter、slice等）和改变原数组（如push、splice、sort等）两类；去重推荐Set+扩展运算符，排序数字必须用比较函数。
2025-12-20 09:31:02
209
javascript如何实现移动端适配_touch事件与click事件有何不同？ 移动端适配核心是响应式布局与触控优化，需设viewport、用flex/rem/vw、辅以媒体查询；touch事件无延迟、支持多点坐标，click有300ms延迟、语义明确；按场景选择：跳转用click加touch-action，手势操作用touch，防误触需结合touchstart/touchend判断。
2025-12-20 09:01:02
363
什么是javascript迭代器与生成器_它们如何简化异步操作？ JavaScript迭代器和生成器本身不直接处理异步操作，但提供可暂停、可恢复的底层机制，配合async/await或手动调度可简化异步流程；迭代器是含next()方法的对象，返回{value,done}，实现可遍历协议。
2025-12-20 08:45:43
598
javascript如何实现3D图形_Three.js怎样在网页中创建场景 Three.js实现3D场景需三要素：WebGLRenderer渲染器、THREE.Scene场景、PerspectiveCamera相机；再添加几何体、材质、网格构成物体，配合环境光与方向光，并用requestAnimationFrame驱动动画及响应窗口缩放。
2025-12-20 08:22:03
896
javascript如何操作cookie_如何设置安全的HttpOnly标志 JavaScript无法读取HttpOnlyCookie，因其设计目的就是禁止客户端脚本访问以防范XSS；JS仅能通过document.cookie操作非HttpOnly、同域、未过期且满足Secure/SameSite等条件的Cookie。
2025-12-20 08:16:40
747
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部