前端 -- 基础 表单标签 - input type属性（按钮篇- submit,reset,button,file）

目录

Submit   

Reset 

Button   

File  

---

Submit   

          #    定义提交按钮，提交按钮会把表单数据发送到服务器     

                前面讲过说把数据送到后台，那怎么送呢 ？？ 

                ===>>>

                就是通过 提交按钮 - submit  来进行送数据的~！！！ 

                即 点击  提交按钮，就会把表单域里所有数据送至后台

        

          示例  ： 

          

          这就是 提交按钮 的语法表示

          ===>>>

          

         会默认显示的是   “ 提交 ” 两个汉字 

         当然了，你也可以将   “提交”  换成其它文字，通过前面学习的  Value 属性 

         ===>>>

        

         ===>>>

        

         诺，这就把 提交 改为了 “免费注册 ”  但，作用是一样的，即点击  “ 免费注册 ” 就会将表单域

         里所有数据 提交给后台~！！！ 

       

         我们可以小小的体验一下流程，是如何通过  提交按钮--submit 来将数据传给后台的 ~！！ 

         ===>>> 

         

         我们在 <from> 加点儿内容 ， action="xxx.php"  就是将表单域提交到 xxx.php 这个页面

         method  就是使用 get 方法~！！ 

         具体怎么使用在后面 服务器编程里学习 ~！！ 

         

        接下来，在页面输入数据，并提交 

        ===>>>

      

       我们在页面里 输入完内容后，点击提交，也就是   “ 免费注册 ”  

       ===>>>

      

     可以看到 未找到文件

   （ 这是要去往 xxx.php 的页面，因为 xxx.php 就不存在呀，是我们捏造的） 

     再注意 地址栏那里， 是不是就是我们 在页面上输入的内容，这就是把 表单域里的东西送给

     xxx.php  网页的体现~！！  

     提交按钮作用就是  ： 点击了 提交按钮，可以把 表单域 form 里面的表单元素 里面的值 提交给

     后台服务器。 

Reset 

     #  即重置按钮，就是说 我们网页里输入的东西，想全部更改下，想作废，就需要 重置按钮 

         ===>>>

      

        ===>>>

        

        这就是重置按钮，也可以使用 Value 属性将名字进行修改 ~！！ 

        ===>>>

        

        ===>>>

       

      ===>>>

      就是当你 在网页里面输入信息想重新输入了，那你就可以使用 重置按钮~！！！ 

      点击后，就会恢复到最开始网页默认的样子~！！ 

       

   Button   

         #   就是一个普通按钮，可以点击的按钮，不会提交数据，只是做某件事情，一般和JS搭配

              ===>>>

            

     上示 免费获取验证码 就是 Button 普通按钮的作用，不会提交数据，就是做验证码这个事儿的

     ===>>>

    

    ===>>>

    

    可以看到上面什么都没有，也要使用 Value 值 进行复制，才有 

    ===>>>

   

   ===>>>

 

 那这个 按钮，点击之后也不提交数据； 要真正使用需要搭配 JS 去使用 ~！！ 

File  

     #   文件域， 使用场景 ： 上传文件使用的。 

          ===>>>

        

        ===>>>

        

         这就是 File 文件的作用，上示后面显示 未选择文件，就是你还没选择好要上传什么文件

         点击按钮

         ===>>>

        

       选择一个文件进行上传 

       

        这个时候就显示的是 你上传的文件类型了~！！