最近做了毕业设计,其中遇到了很多问题。其中之一就是关于reset标签,以前做项目的时候也并没有过多的关注,甚至忽略掉了这个知识点。这次项目时间比较充分,我就细细的研究了一下,并进行综合整理,顺便分享出来,供初学者借鉴!
使用<reset>标签,有时候我们会发现reset按钮失效,点击该按钮并不能清空输入框。
原因在此:
w3c网站有这样的描述(http://www.w3school.com.cn/htmldom/dom_obj_reset.asp
)"在 HTML 表单中 <input type="reset"> 标签每出现一次,一个Reset对象就会被创建。当重置按钮被点击,包含它的表单中所有输入元素的值都重置为它们的默认值。默认值由 HTML value 属性或 JavaScript 的 defaultValue 属性指定。"意思就是如果一个表单
项设置了value属性的值,那么点击reset按钮就会恢复此表单项到这个value属性的值,而不是空。
结论如下:
reset并不是清空输入框的值,而是将输入框的值恢复到value属性所指定的值。
看以下的例子就清楚了。将下面的HTML代码保存为一个.html文件,用浏览器打开,修改输入框的内容后,点击reset按钮,即可看到效果。
<form>
<input type="textarea" value="defaultValue"/>
<input type="reset" />
</form>
但是查询的结果页面我们有时候又希望value属性是有值的(上次查询的输入条件),那么我们就不能使用reset标签来实现清空功能了。
模拟的办法如下:使用button标签替代reset标签,利用js将该textarea的值置空。
分享到:
相关推荐
在Web表单中,这个按钮通常与HTML的`<input type="reset">`元素关联,点击后,表单内的所有输入控件都会恢复到初始状态,即用户未进行任何输入时的状态。然而,在ASP.NET中,我们可以使用服务器端控件,如`Button`...
最近有人问我提交表单后怎么把输入框的内容清空了。 这种方法不止一种, 1、可以用表单的重置功能。 按钮设置: formType="reset">提交 form设置: bindreset="formReset"> 表单重置时会触发reset事件,在...
然而,有时候开发者可能会遇到`reset`按钮失效,即点击该按钮后输入框的值并未清除。这种问题通常是由于对`reset`按钮的工作原理理解不透彻导致的。让我们深入探讨这个问题。 首先,`<input type="reset">`标签在...
pureClearButton是一款基于Bootstrap的非常实用的用于清空和重置input输入框内容的jQuery按钮插件。当好在输入框中输入一些内容之后,如果想清除这些内容,可以直接点击输入框右侧的小圆叉按钮即可。
### 中兴H618B刷Tomato DualWAN固件后Reset按钮功能异常解决方案 在使用中兴H618B路由器时,部分用户可能会遇到一个常见的问题:即在将路由器刷成Tomato DualWAN固件后,Reset按钮的功能出现异常。此问题主要表现为...
在jQuery中,可以通过调用`.trigger("click")`方法模拟点击事件,从而触发隐藏的reset按钮。这一操作会调用表单的默认重置行为,将表单内所有字段恢复到初始状态。 ### 知识点六:表单内input和textarea元素的清空 ...
这可以通过在发送按钮的点击事件中使用`form-type="reset"`来实现。在WXML(微信小程序的标记语言)中,我们可以设置一个表单(form)包含输入框和发送按钮: ```html 请输入内容" bindinput="bindInputData" /...
清空默认样式reset.min.css
此外,封装的类可能还包含了一些辅助方法,如`validateInput()`用于在提交时进行整体校验,`reset()`用于清空输入框,以及一些配置属性,如`allowNegativeNumber`(是否允许负数)、`maxLength`(最大长度)等,方便...
在实际应用中,可能还需要根据项目需求对组件进行更复杂的定制,例如调整日期格式、添加日期限制或自定义清空按钮的外观等。通过深入理解ExtJs的组件体系和MVC模式,我们可以灵活地扩展和定制任何控件,以满足不同...
这里,'clearButton'是用于清空表单的按钮的ID,当用户点击这个按钮时,会调用`clearForm`函数,清空表单。 此外,`Demo.html`可能是一个包含了表单和清空功能的HTML文件,而`Js`和`Style`可能分别存放着与之相关的...
如下所示: 点击重置时,输入框被重置为空,而账号 select元素并没有被重置。 // 重置事件 $("#reset").click(function () { $("#searchContent").val(""); $("#selectKey").val(""); form.render(); }) ...
"Trail-reset 试用信息清空"这个主题涉及到的是如何清除虚拟音频(VA)软件的试用信息,以便重新开始试用周期。这通常是通过修改注册表来实现的,因为注册表存储了软件安装和使用的关键信息。 首先,我们要理解...
3. 在请求成功或失败后,调用`form.reset()`清空表单字段。 4. 调用`layui.form.render()`更新表单视图,确保与实际状态同步。 这个过程不仅适用于商品发布,也可以应用到任何需要处理表单数据并重置表单的场景。在...
在这个例子中,用户可以输入他们的姓名和电子邮件,然后点击"重置"按钮,所有输入框的值都会被清空。 在实际开发中,为了提高用户体验和无障碍性,我们还应该考虑添加适当的`id`和`class`属性,以及使用`<label>`...
通过上述分析可以看出,使用JavaScript自定义函数来清空页面上的文本框是一种实用且灵活的方法,尤其适用于那些不适合使用标准`reset`方法的场景。通过合理的代码设计和逻辑优化,可以使得该功能更加健壮、高效。
通过设置`type`属性,如`type="submit"`或`type="reset"`,可以定义按钮的行为。 【CSS3动画】 CSS3的`@keyframes`规则允许创建复杂的动画效果。通过定义动画的开始和结束状态,以及过渡过程中的中间状态,可以...
这种方法较为简便,只需要在页面中隐藏一个reset按钮,然后通过JavaScript触发该按钮的点击事件即可清空表单。 ```html <!-- 用来清空表单数据 --> <input type="reset" name="reset" style="display:none;"/> ``` ...
当用户点击按钮触发事件时,可以利用JavaScript删除原有的`<input type="file">`元素,并重新创建一个新的`<input type="file">`元素来替代它,从而达到清空文件选择的效果。 示例代码如下: ```html ()"> ...