Question

您好我有一个html页面，其中包含form，我希望在点击form时会弹出一个提醒框并说“谢谢你联系”所有使用javascript在这里是我的代码。

PS。正如您将注意到我在提交时已经form验证。我希望除了验证之外还要添加顶级的javascript警告框。

<form id="contact" onsubmit="checkContactForm(); return false;" onreset="resetForm();" action="">
  <p>Fill in the form below to send me a message!</p>    

  <div id="errormessage"></div>

  <p>
    <label for="name">Name:</label>
    <input type="text" name="name" id="name" onfocus="resetField(this);" />
  </p>
  <p>
    <label for="email">E-mail address:</label>
    <input type="text" name="email" id="email" onfocus="resetField(this);" />
  </p>
  <p>
    <label for="message">Your Message:</label>
    <textarea name="message" id="message" rows="5" cols="25" onfocus="resetField(this);"></textarea>
  </p>
  <p>
    <button type="submit">Send Message</button>
    <button type="reset">Reset Form</button>
  </p>
</form>

Answer 1

在Jsfiddle

上试试并举例

<html>
  <head>
  </head>
  <body >
    <div id="errormessage"></div>
    <form id="new">
      <p>
        <label for="name">Name:</label>
        <input type="text" name="name" id="name" " />
      </p>
      <p>
        <label for="email">E-mail address:</label>
        <input type="text" name="email" id="email" " />
      </p>
      <p>
        <label for="message">Your Message:</label>
        <textarea name="message" id="message" rows="5" cols="25"></textarea>
      </p>
      <p>
        <button  onClick="aler()">Send Message</button>
        <button type="reset">Reset Form</button>
      </p>
    </form>
    <script type="text/javascript">
      function aler(){
        alert("thank you for getting in touch" );
        document.getElementById("new").submit();
      }
    </script>
  </body>
</html>

Answer 2

这会在提交时显示警告框

<div id="errormessage"></div>
<form action="#" onsubmit="alert('Thank you for getting in touch');">
<p>
  <label for="name">Name:</label>
  <input type="text" name="name" id="name" onfocus="resetField(this);" />
</p>
<p>
  <label for="email">E-mail address:</label>
  <input type="text" name="email" id="email" onfocus="resetField(this);" />
</p>
<p>
  <label for="message">Your Message:</label>
  <textarea name="message" id="message" rows="5" cols="25" onfocus="resetField(this);"></textarea>
</p>
<p>
  <button type="submit">Send Message</button>
  <button type="reset">Reset Form</button>
</p>
</form>

提交javascript

2 个答案: