按下特定按钮时弹出窗口

时间:2015-02-26 11:24:41

标签: javascript html css

我正在为大学制作一个网站,我需要在其中加入JavaScript,所以当我点击CSS中的“提交”按钮时我想出现一个弹出框,但我并不完全确定怎么做。目前我已经为弹出框提供了以下JavaScript:

<button onclick="SubmitBtn">Hello</button>
<script>
function myFunction() {
    alert("Your email has been sent!");
}
</script>   

然而,它只是创建另一个按钮而不起作用。我不擅长使用JavaScript,因为我几周只做了这些,所以任何帮助都会非常感激。我想要按下的按钮位于页面底部的表格中。

我将完整的代码放在下面没有CSS:

<!DOCTYPE html>
<html>
<head>

</body>
</html>

<button onclick="SubmitBtn">Hello</button>

<script>
function myFunction() {
    alert("Your email has been sent!");
}
</script>

<title>OINK - Contact Us</title>
<body>
<div id="container">
<center><p>WELCOME TO THE OINK LAYOUT!</p></center></font>
<div id="menu">
<ul>
<center>
<li><a class="button_example" href="index.html">HOME</a></li>
<li><a class="button_example" href="piggybanks.html">PIGGY BANKS</a></li>
<li><a class="button_example" href="moosic.html">MOOSIC</a></li>
<li><a class="button_example" href="contact.html">CONTACT US</a></li>
<li><a class="button_example" href="pigtures.html">PIGTURES</a></li>
</center>
</ul>
<p>&nbsp;</p>
<p>&nbsp;</p>

<div>

  <!-- <div id="footer">This is the footer</div> -->
</div>

<form id="form1" name="form1" method="post" action="#" onsubmit="return checkform(this);">
  <label for="Name"><FONT FACE="ComingSoon">Name</label></FONT>
  <input type="text" name="Name" id="Name" />
  <br />
<label for="Email"><FONT FACE="ComingSoon">Email</label></FONT>
  <input type="text" name="Email" id="Email" />
  <br />
  <label for="Message"><FONT FACE="ComingSoon"> Message<br /></FONT>
</label>
  <textarea name="Message" id="Message" cols="45" rows="5"></textarea>
  <input type="submit" name="SubmitBtn" id="SubmitBtn" value="Submit" />
</form>


<div id="footer">Copyright 2015-2024 by Y/N
<br>
All rights reserved<br>
OINK is a trademark of Y/N
<br>
This page was last updated on 22 January 2015</div>
</div>
</body>
</html>

2 个答案:

答案 0 :(得分:2)

试试这个

<button onclick='foo();'>Hello</script>
<script>
function foo(){
 alert('Your email has been sent');
}
</script>

答案 1 :(得分:1)

您可以检索from并覆盖onsubmit函数:

<script>
var form = document.forms.SubmitBtn;

form.onsubmit = function(){
    alert("Your email has been sent!");
    return true;
}
</script>

这应该有用。