Question

<form id="myForm">
    <input type="text" value="Try me!">
    <button type="submit">Go</button>
</form>
<script type="text/javascript">
    function init(){
        var form = document.getElementById("myForm");
        form.addEventListener("submit", process, false);
    };
    function process(){
        console.log("Yikes!");
        return false;
    };
    document.addEventListener("DOMContentLoaded", init, false);
</script>

我搜索过，真的。我发现了一些有用的东西，但我被告知使用eventlisteners而不是“onsubmit”等。我假设表单提交的默认行为是重新加载页面，但我认为返回false会阻止它。我发现有效的代码是：

window.onload=function() {
    document.getElementById('my-form').onsubmit=function() {
    /* do what you want with the form */

    // Should be triggered on form submit
    console.log("Yipee!");
    // You must return false to prevent the default form behavior
    return false;
  }
}

对我学习之旅的任何帮助都非常感激。

Answer 1

使用preventDefault方法。

function init(){
    var form = document.getElementById("myForm");
    form.addEventListener("submit", process, false);
};
function process(e){
    console.log("Yikes!");
    e.preventDefault()
    return false;
};
document.addEventListener("DOMContentLoaded", init, false);

Answer 2

试试这个：

<form id="myForm">
    <input type="text" value="Try me!">
    <button type="submit">Go</button>
</form>
<script type="text/javascript">
    function init()
    {
        var form=document.getElementById("myForm");
        form.addEventListener("submit", process, false);
    }
    function process(e)
    {
        console.log("Yikes!");
        e.preventDefault();
    }
    document.addEventListener("DOMContentLoaded", init, false);
</script>

OR

window.onload=function()
{
    document.getElementById('myForm').onsubmit=function(e)
    {
        console.log("Yipee!");
        e.preventDefault();
    }
};

您需要使用 preventDefault（）来阻止提交表单。

我不希望我的页面或控制台刷新！ Javascript表单处理

2 个答案: