显示隐藏的 Div 在提交时保持隐藏状态

Question

你好，我有一个模态表单。在此表单中有一个提交按钮。我只想在单击此按钮时显示结果。这些结果位于模式之外，应在单击提交按钮后显示。我设法隐藏了结果，但似乎无法透露它。这就是我得到的：

function onSubmit(){

    document.getElementById('submitButton').style.display = "none";

    document.getElementById('revealProgress').style.display = "block";

    return true;

}

#revealProgress{

    display: none;

}

    <button onclick =" window.location.href = '#close'; deleteData();  getData();;" href="#close" id="submitButton" class="tester2"  > Submit </button>

<div id = "revealProgress">

    <p>Exercise: <strong id="exerciseList"></strong></p></strong></p><br>

    <p>Sets: <strong id="setList"></strong></p></strong></p><br>

    <p>Reps: <strong id="repList"></strong></p></strong></p><br>

    <p>Weight: <strong id="weightList"></strong></p></strong></p><br>

    <p>total: <strong id="totalList"></strong></p></strong></p><br>

    <div id="progress_bar"></div>

</div>

你看到我做错了什么了吗？

Answer 1

你根本没有使用JS函数，所以什么也没有发生！对于您的情况，最简单的解决方案是替换它：onclick&nbsp;="&nbsp;window.location.href&nbsp;=&nbsp;'#close';&nbsp;deleteData();&nbsp;&nbsp;getData();;"有了这个：onclick&nbsp;=&nbsp;"onSubmit()"这是执行此操作后的工作片段：function onSubmit(){&nbsp; &nbsp; document.getElementById('submitButton').style.display = "none";&nbsp; &nbsp; document.getElementById('revealProgress').style.display = "block";&nbsp; &nbsp; return true;}#revealProgress{&nbsp; &nbsp; display: none;}&nbsp; &nbsp; <button onclick = "onSubmit()" href="#close" id="submitButton" class="tester2"&nbsp; > Submit </button><div id = "revealProgress">&nbsp; &nbsp; <p>Exercise: <strong id="exerciseList"></strong></p></strong></p><br>&nbsp; &nbsp; <p>Sets: <strong id="setList"></strong></p></strong></p><br>&nbsp; &nbsp; <p>Reps: <strong id="repList"></strong></p></strong></p><br>&nbsp; &nbsp; <p>Weight: <strong id="weightList"></strong></p></strong></p><br>&nbsp; &nbsp; <p>total: <strong id="totalList"></strong></p></strong></p><br>&nbsp; &nbsp; <div id="progress_bar"></div></div>