此问题在此处已有答案：

How to prevent default on form submit?（3个答案）
20天前关闭。
我最近添加了禁用/启用提交按钮功能。然而，我遇到了一个新的问题。用户数据在我点击提交按钮后消失得超快。我想把它存储在表数据中。我真的很感激任何关于这方面的指导！
下面是我的用户数据的HTML代码：

<div id="data">
    <form id="breakies">
    <p> Breakfast Options</p>
        <div>
        <input type="checkbox" id="protein-oatmeal" name= "breakies" value="Protein Oatmeal"> 
        <label for="protein-oatmeal">Protein Oatmeal</label>
        </div>
        <div>
            <input type="checkbox" id="toast-and-eggs" name= "breakies" value="Toast and Eggs"> 
            <label for="toast-and-eggs">Toast and Eggs</label>
        </div>
        <div>
            <input type="checkbox" id="gyp" name= "breakies" value="Greek Yogurt Parfait"> 
            <label for="gyp">Greek Yogurt Parfait</label>
        </div> 
        <div>
            <input type="checkbox" id="pw" name= "breakies" value="Protein Waffles"> 
            <label for="pw">Protein Waffles</label>
        </div>
        <br><input type="checkbox" name="checkme" id="checkBox">
        <label for="checkBox"> I have selected at least 4 options for each meal</label>
        <br><input type="submit" id="submitButton" name="submit" onclick= "addData()">
    </form>

字符串
下面是表数据的HTML代码：

<div id="tab">
    <table id="list" cellspacing="0px" cellpadding="20px" text-align="center">
    
        <thead>
            <tr>
                <td>Monday</td>
                <td>Tuesday</td>
                <td>Wednesday</td>
                <td>Thursday</td>
                <td>Friday</td>
                <td>Saturday</td>
                <td>Sunday</td>
            </tr>
        </thead>
        <tbody></tbody>
    </table>
</div>

型
这是JavaScript/jQuery部分：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(function() {
    

    $('#submitButton').attr('disabled', 'disabled');

    $('#checkBox').click(function() {
        if ($(this).is(':checked')) {
            $('#submitButton').removeAttr('disabled');
        } else {
            $('#submitButton').attr('disabled', 'disabled');
        }
    });
});
</script>
<script>

function addData() { 
    var rows = "";
    var a = document.getElementById("protein-oatmeal").value;
    var b = document.getElementById("toast-and-eggs").value;
    var c = document.getElementById("gyp").value;
    var d = document.getElementById("pw").value;

    rows += "<td>" + a + "</td><td>" + b + "</td><td>" + c + "</td><td>" + d + "</td><td>"+ b + "</td><td>"+ c +"</td><td>"+ a + "</td>";
        var tbody = document.querySelector("#list tbody");
        var tr = document.createElement("tr");

        tr.innerHTML = rows;
        tbody.appendChild(tr)

}

</script>

型