为了防止表单提交，你只需要这样做。

<form onsubmit="event.preventDefault()">
    .....
</form>

通过使用上述代码，这将阻止您的表单提交。

以下是目前为止的工作(在chrome和firefox测试):

<form onsubmit="event.preventDefault(); return validateMyForm();">

其中validateMyForm()是一个函数，如果验证失败则返回false。关键是使用名称事件。我们不能使用例如e.c epreventdefault ()

与其他答案不同，返回false只是答案的一部分。考虑这样一个场景:JS错误发生在return语句之前…

html

<form onsubmit="return mySubmitFunction(event)">
  ...
</form>

脚本

function mySubmitFunction()
{
  someBug()
  return false;
}

这里返回false将不会被执行，表单将以任何一种方式提交。还应该调用preventDefault来防止Ajax表单提交的默认表单操作。

function mySubmitFunction(e) {
  e.preventDefault();
  someBug();
  return false;
}

在这种情况下，即使有bug，表单也不会提交!

或者，尝试…可以使用Catch块。

function mySubmit(e) { 
  e.preventDefault(); 
  try {
   someBug();
  } catch (e) {
   throw new Error(e.message);
  }
  return false;
}

<form v-on:submit.prevent="yourMethodHere">

提交事件将不再重新加载页面。它运行你的方法。

来自vue文档:https://vuejs.org/guide/essentials/event-handling.html#event-modifiers

试试这个……

HTML代码

<form class="submit">
    <input type="text" name="text1"/>
    <input type="text" name="text2"/>
    <input type="submit" name="Submit" value="submit"/>
</form>

jQuery代码

$(function(){
    $('.submit').on('submit', function(event){
        event.preventDefault();
        alert("Form Submission stopped.");
    });
});

or

$(function(){
    $('.submit').on('submit', function(event){
       event.preventDefault();
       event.stopPropagation();
       alert("Form Submission prevented / stopped.");
    });
});

你可以在表单中添加eventListner，即preventDefault()并将表单数据转换为JSON，如下所示:

const formToJSON = elements => [].reduce.call(elements, (data, element) => { data[element.name] = element.value; return data; }, {}); const handleFormSubmit = event => { event.preventDefault(); const data = formToJSON(form.elements); console.log(data); // const odata = JSON.stringify(data, null, " "); const jdata = JSON.stringify(data); console.log(jdata); (async () => { const rawResponse = await fetch('/', { method: 'POST', headers: { 'Accept': 'application/json', 'Content-Type': 'application/json' }, body: jdata }); const content = await rawResponse.json(); console.log(content); })(); }; const form = document.forms['myForm']; form.addEventListener('submit', handleFormSubmit); <form id="myForm" action="/" method="post" accept-charset="utf-8"> <label>Checkbox: <input type="checkbox" name="checkbox" value="on"> </label><br /><br /> <label>Number: <input name="number" type="number" value="123" /> </label><br /><br /> <label>Password: <input name="password" type="password" /> </label> <br /><br /> <label for="radio">Type: <label for="a">A <input type="radio" name="radio" id="a" value="a" /> </label> <label for="b">B <input type="radio" name="radio" id="b" value="b" checked /> </label> <label for="c">C <input type="radio" name="radio" id="c" value="c" /> </label> </label> <br /><br /> <label>Textarea: <textarea name="text_area" rows="10" cols="50">Write something here.</textarea> </label> <br /><br /> <label>Select: <select name="select"> <option value="a">Value A</option> <option value="b" selected>Value B</option> <option value="c">Value C</option> </select> </label> <br /><br /> <label>Submit: <input type="submit" value="Login"> </label> <br /><br /> </form>