表单控件——form

表单控件指的不是表单 是input那些标签 select button

如果把控件放在form标签内部就会有他们各自的系统自带的功能

action是一个网址 ==>当用户点击提交了以后会把打包的数据传输给这个网址对应的计算机(服务器,后端)

            method是怎么传输表单中的数据

            enctype是怎么打包表单数据:

            application/x-www-form-urlencoded 打包为表单编码的数据

            multipart/form-data 打包为二进制数据包

            text/plain  打包为字符串

 

            input type:

            input submit value值给用户渲染不打包传给后端当用户点击的时候就会自动把当前submit所在表单内部的所有输入型(用户能操作的)全部打包发送给后端 然后就是a标签功能

            如果自己给submit绑定有点击事件  那么它会先执行自己的点击事件,然后在执行系统默认的点击事件

            常常自己写事件做前端表单验证 然后阻止系统默认事件执行 验证完毕以后可以:自己提交数据 也可以用js代码去触发submit提交的功能:form.submit()

             button按钮如果写在了form内部: type="button"的按钮是普通  没有写这个属性按钮就是submit按钮

             url1.οnchange=function(e) {

            console.log(666,e)

             }

             color1.onchange = function(e) {

              e = e || window.event

              console.log(666, this.value, e.target.value)

            }

            name属性 是系统打包数据的时候会把name作为key把value属性最为value打包

             emali=123&color1=#777&pwd1=123

            如果是复选框 也会一样的把name的值作为key多次拼接==>需要后端解析

            

            

             select内部的option设置了点击事件 会点不动  有需求:给select绑定change事件

             city.οnchange=function  () {

              console.log(this.value)

             }

            

             text.οninput=function  (e) {

              console.log(e.data,e.target.value)

             }

             file1.οnchange=function  () {

              console.log(this.files)

             }