在文章正式开始之前呢,先介绍一个知识点,那就是var和let的区别,查看了各路大佬的文章,也经过各种尝试,最终得出的结果是,let声明的变量只在该变量对应的块中有效,有点局部变量的意思,而且let相对来说更加的严格。
正式开始我们的formdata之路,曾经稚嫩的我们在取form表单的值(value)时,都是这样的
var name1 = document.getElementById(‘name’).value; //获取id为name的值
var submit1 = document.getElementById(‘submit’);//获取submit.准备为其绑定事件
submit1.onclick = function(){alert(name1)}//为submit绑定点击事件,将name的值在也页面弹窗显示
上面这种方法获取表单的值,不仅麻烦,而且代码量大,我们一起来看看更快更简洁的方法
第一种:获取普通input中的值
function mySubmit(form){
let formData = new FormData(form);
let username = formData.get(‘username’);
if(username.length < 5){
alert('用户名不得小于5位');
return false;
}else{
return true;
}
return false;
}
第二种:获取type为checkbox类型的input的值
音乐
游戏
电影
function mySubmit(form){
//定义formData对象
let formData = new FormData(form);
//获取值,因为get只能获取一个值,而这里是多选框,所以这里使用getAll方法
let hoppy1 = formData.getAll(‘hoppy’);
console.log(hoppy1);
//页面数据不进行提交,只是进行测试
return false;
}
到此这篇关于JS更简单的获取表单中数据(formdata)的文章就介绍到这了,更多相关js获取表单数据内容请搜索IT俱乐部以前的文章或继续浏览下面的相关文章希望大家以后多多支持IT俱乐部!