揭示隐藏的潜水在提交时保持隐藏

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 =" window.location.href = '#close'; deleteData();  getData();;"

有了这个：

onclick = "onSubmit()"

以下是这样做后的工作片段：

function onSubmit(){
document.getElementById('submitButton').style.display = "none";
document.getElementById('revealProgress').style.display = "block";
return true;
}

#revealProgress{
display: none;
}

<button onclick = "onSubmit()" 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>