form的submit阻止表单提交

发布时间 2023-08-11 10:06:47作者: 看风景就

1. return false 方法

<form onsubmit="return onFormSubmit(this)"></form> //能阻止

<form onsubmit="onFormSubmit(this)"></form> //不能阻止
function onFormSubmit(form){
    return false;
}

2. preventDefault

preventDefault可在判断中使用,按条件阻止

//能阻止
<form onsubmit="onFormSubmit(event)"></form> 
function onFormSubmit(e){
    e.preventDefault();
}

//form表单的提交事件可阻止
form.addEventListener('submit', e => {
    e.preventDefault();
})

//提交按钮的click方法preventDefault可阻止
let btnSubmit = document.getElementById('btnSubmit');
btnSubmit.onclick = function(e){
    let name = document.getElementById('user').value;
    if(name.length < 5){
        e.preventDefault();
    }
    else{

    }
}