表单reset重置按钮的作用并非是清空表单-阿里云开发者社区

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

2018-03-01 2023

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介：

不少初学者可能会认为表单元素的reset按钮是清空表单元素，其实并非如此。

看如下代码示例:

         <!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重置按钮的作用并非是清空表单

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

热门文章

最新文章

相关电子书