Question

我有创建表单的代码，当您单击提交时，它应该在屏幕上输出文本。但是我的代码并没有在屏幕上显示消息，尽管它会快速显示文本然后隐藏它。

<div id="form-wrap">
<form>
    <fieldset>
    <h4>Contact Form:</h4>
        <label class="labelone" for="name">Name: </label>           
        <input name="name"/>
        <label for="email">Email: </label>
        <input name="email" />
        <label for="comments">Comments: </label>
        <textarea name="comments"></textarea>
  </fieldset>
<fieldset>
<input class= "btn" type="submit" value="Send Email" onclick="myFunction()"/>
<input class="btn" type="reset" value="Reset Form"/>
</fieldset>
</form>
<p id="jomin">This is a message</p>
</div>

风格

<style type="text/css">
#jomin {    visibility:hidden;
}
</style>

JAVASCRIPT

<script type="text/javascript">
function myFunction()   {
document.getElementById("jomin").style.visibility="visible";
}
</script>

Answer 1

您没有看到更改，因为表单正在提交并且页面正在重新加载。

变化：

<input class= "btn" type="submit" value="Send Email" onclick="myFunction()"/>

到

<input class= "btn" type="submit" value="Send Email" onclick="return myFunction()"/>

并且还要改变

function myFunction()   {
    document.getElementById("jomin").style.visibility="visible";
}

到

function myFunction()   {
    document.getElementById("jomin").style.visibility="visible";
    return false;
}

<强> jsFiddle example

单击按钮时会显示文本消息

1 个答案: