表单reset重置按钮的作用并非是清空表单

  1. 云栖社区>
  2. 蚂蚁部落>
  3. 博客>
  4. 正文

表单reset重置按钮的作用并非是清空表单

青衫无名 2018-03-01 15:47:00 浏览660
展开阅读全文
不少初学者可能会认为表单元素的reset按钮是清空表单元素,其实并非如此。

看如下代码示例:


01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>蚂蚁部落</title>
<style>
ul li{
  list-style:none;
  height:30px;
}
</style>
</head>
<body>
<form>
  <ul>
    <li>姓名:<input type="text"/></li>
    <li>地址:<input type="text" value="山东省青岛市"/></li>
    <li>
      <input type="submit" value="提交"/>
      <input type="reset" value="重置"/>
    </li>
  </ul>
</form>
</body>
</html>

大家可以在文本框内容输入内容,然后点击重置按钮测试效果。

可以看出此按钮的作用是重置元素的value值,而不是清空value值。



原文发布时间为:2017-2-23

本文作者:admin

本文来自云栖社区合作伙伴“蚂蚁部落”,了解相关信息可以关注蚂蚁部落

原文链接:表单reset重置按钮的作用并非是清空表单


网友评论

登录后评论
0/500
评论
青衫无名
+ 关注
所属云栖号: 蚂蚁部落