本来是研究ES6的对象的解构赋值的,自己突发奇想,将表单页面的数据提交到后端对象中的,用纯原生的方式编写代码,结果运行代码没有报错,怎么就获取不到表单输入框输入的内容,百思不得其解。先展示错误代码
当运行上述代码的时候,打开浏览器,点击提交按钮,控制台结果一闪而过,最后询问大佬,大佬告知我说,from表单是默认提交的,控制台打印肯定不显示的,需要做的是阻止默认事件就ok了,然后给我指出使用event.preventDefault()。
event.preventDefault()是何方法宝?那么厉害呢?以前学艺不精忘记了,这里在复习一遍。
event.preventDefault()方法是用于取消事件的默认行为,例如,当点击提交按钮时阻止对表单的提交。但此方法并不被ie支持,在ie下需要用window.event.returnValue = false; 来实现。
其实就是用来取消时间的默认动作。
注意
1、如果 Event 对象的 cancelable 属性是 fasle,那么就没有默认动作,或者不能阻止默认动作。无论哪种情况,调用该方法都没有作用。
2、此方法并不被ie支持,在ie下需要用window.event.returnValue = false; 来实现。
修改后的代码就是需要添加event.preventDefault(),代码如下所示:
在上面代码中还有一个知识点就是ES6的对象解构赋值,在一个对象中,当属性(key)与属性值(前面定义的变量)一样的时候,是可以省略的,可以只写一个(key)属性。