javascript之表单元素的新属性

传统的INPUT的表单类型：text、password、submit、reset、button、radio、checkbox、file、hidden...

HTML5中新增长了一些类型：search、url、email、tel、number、range、color、data、time、dataTime...

pc端传统表单元素经常使用的事件：click、change、focus、blur、keydown、keyup...

移动端表单元素的事件：在移动端没有keydown、keyup事件(不多有的),由于移动端使用的键盘是虚拟的键盘；移动端多了一个事件类型:input事件；

做用：一、提供了更大强大的功能，方便了咱们的开发；

        二、在移动端使用对应的input类型，当用户输入的时候能够调取出对应的虚拟键盘，方便用户快速输入(这个是H5表单新类型的最核心的做用)

        三、相对于传统的表单提供了更强大的表单验证：JS中新提供的是input.checkValidity()方法

            css3中提供的是input:valid / input:invalid

    HTML5除了给input新增长类型外，还增长一个经常使用的属性：placeholder，用来给文本框设置默认提示信息的，可是在IE浏览器中支持的不是特别好

    HTML5还提供了一些新的表单元素：datalist、progress...

 

 

上传文件：

var file = document.getElementById("companylogo").files[0]//获取文件对象赋值
if (typeof FileReader == "undefined") {
  alert("您的浏览器不支持FileReader！")
}
var fReader = new FileReader();
//ml5新对象
fReader.onload = function (e) {//图片存储完毕
  document.getElementById("companyimg").src = e.target.result;//图片预览
  _this.savepicture = e.target.result//获取base64图片字符串
  var requestNumber = Math.ceil(_this.savepicture.length / 4000)//获取请求总次数
  console.log("请求总次数" + requestNumber)//请求总次数
  if (_this.savepicture.length < 4000) {//字符串长度小于4000
    _this.uploadpictures(0)//is_page 为0 请求一次
  } else {
    _this.uploadpictures(requestNumber)//请求屡次  把次数传给交互
  }
}
fReader.readAsDataURL(file);

关于表单上传文件的文章连接：https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader