event.preventDefault()
如果事件可取消，则取消该事件，而不停止事件的进一步传播。
- 比如下面的实例，做一个校验，输入不满足的则不会写入。
<!DOCTYPE html>
<html>
<head>
<title>preventDefault example</title>
</head>
<body>
<p>请输入一些字母,只允许小写字母.</p>
<form>
<input type="text" id="my-textbox"/>
</form>
<script type="text/javascript">
function checkName(evt) {
debugger;
var spanEl = document.querySelector('form span');
if(spanEl){
spanEl.parentNode.removeChild(spanEl);
}
var charCode = evt.charCode;
if (charCode != 0) {
if (charCode < 97 || charCode > 122) {
var form = document.querySelector('form');
evt.preventDefault();//event.preventDefault()
let warnEl = document.createElement('span');
warnEl.innerText = "只能输入小写字母";
warnEl.style.color = 'red';
form.appendChild(warnEl);
}
}
}
document.getElementById('my-textbox').addEventListener(
'keypress', checkName, false
);
console.log(document.getElementById('my-textbox'));
</script>
</body>
</html>
不满足的取消事件，所以不满足条件的输入不会写入到input里面