Question

3 buttons 3 onclick events

这可能是一个非常基本的问题;相信我，我发现很难在互联网上找到这个问题的答案。我的服务器（本地Tomcat）存储了3个HTML页面。我想按一下按钮打开这些HTML页面。任何帮助将受到高度赞赏。

这是我的代码，

<!DOCTYPE html>
<html>
  <head>
      <meta charset="ISO-8859-1">
      <title>Online Student Portal</title>
  </head>
<body>
  <form action="">
      <h2>Select Your Choice..</h2>
      <input type="button" value="Add Students">
      <input type="button" value="Add Courses">
      <input type="button" value="Student Payments">
  </form>
</body>
</html>

Answer 1

试试这个： -

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="ISO-8859-1"> 
    <title>Online Student Portal</title> 
</head> 
<body> 
    <form action="">
         <input type="button" value="Add Students" onclick="window.location.href='Students.html';"/>
         <input type="button" value="Add Courses" onclick="window.location.href='Courses.html';"/>
         <input type="button" value="Student Payments" onclick="window.location.href='Payment.html';"/>
    </form> 
</body> 
</html>

Answer 2

你们都应该知道这是内联脚本，并不是一个好的做法......据说你应该明确地使用javascript或jQuery来做这类事情：

HTML

<!DOCTYPE html> 
<html> 
 <head> 
    <meta charset="ISO-8859-1"> 
    <title>Online Student Portal</title> 
 </head> 
 <body> 
    <form action="">
         <input type="button" id="myButton" value="Add"/>
    </form> 
 </body> 
</html>

JQuery的

var button_my_button = "#myButton";
$(button_my_button).click(function(){
 window.location.href='Students.html';
});

的Javascript

  //get a reference to the element
  var myBtn = document.getElementById('myButton');

  //add event listener
  myBtn.addEventListener('click', function(event) {
    window.location.href='Students.html';
  });

查看评论why avoid inline scripting以及why inline scripting is bad

Answer 3

第一个按钮上的

添加以下内容。

onclick="window.location.href='Students.html';"

同样做剩下的2个按钮。

<input type="button" value="Add Students" onclick="window.location.href='Students.html';"> 
<input type="button" value="Add Courses" onclick="window.location.href='Courses.html';"> 
<input type="button" value="Student Payments" onclick="window.location.href='Payments.html';">

Answer 4

此示例将帮助您：

<form>
    <input type="button" value="Open Window" onclick="window.open('http://www.google.com')">
</form>

您可以通过以下方式在同一页面打开下一页：

<input type="button" value="Open Window" onclick="window.open('http://www.google.com','_self')">

Answer 5

jsfiddle中的按钮onclick事件有问题吗？

如果有，请参阅Onclick event not firing on jsfiddle.net

Answer 6

<body>
"button" value="Add Students" onclick="window.location.href='Students.html';"> 
<input type="button" value="Add Courses" onclick="window.location.href='Courses.html';"> 
<input type="button" value="Student Payments" onclick="window.location.href='Payments.html';">
</body>

HTML按钮onclick事件

6 个答案: