如何在表单中点击提交按钮后显示隐藏的div？

问题描述：

我有简单的HTML表单和提交按钮。点击此按钮后，我想看看之前看不到的 div＃my_id 。

I have simple HTML form with submit button. After hitting this button I would like to the see div#my_id which is not visible before.

<input type="submit" name="xxx" value="yyy" onclick="document.getElementById('my_id').style.display = 'block' ;">

<div id="my_id" style="display: none"> My text </div>

我如何才能使它工作？

答

您的HTML是否包含在< form> 标记内？您的提交按钮可能是在提交表单并在执行JavaScript之前导致页面刷新。

Is your HTML contained within the <form> tag? It is likely that your submit button is submitting the form and causing a page refresh before the JavaScript is executed.

如果是这种情况，请尝试将输入类型更改为按钮看到效果。

If this is the case, try changing the input type to button to see the effect.

例如：

#my_id {
    display: none;
}

<form>
    <input type="button" name="xxx" value=" Show Text! " onclick="document.getElementById('my_id').style.display = 'block' ;" />
    <div id="my_id"> My text </div>
 </form>

如何在表单中点击提交按钮后显示隐藏的div？

相关推荐