创建一个警报，显示何时提交表单

Question

我正在尝试在 javascript 中创建一个函数，当您单击提交按钮时它会显示一个警报。我设法让警报显示，但它只在您打开页面时弹出，但在您单击提交按钮时不起作用。这是我在 javascript

中创建的函数

function orderTics(){
//creates alert
var orderTotal=35;

alert("Your order total is $"+orderTotal);

}

我在 html 中这样调用函数：

<script>
orderTics();
</script>

我仍然是一个初学者，所以任何和所有提示都将不胜感激

Answer 1

像这样调用你的函数：

<input type="button" value="myButton" onclick="orderTopics();">

Answer 2

您可以像这样使用提交功能：

$("form.class-name").on("submit", function() {
  alert("I've been submitted.");
});

香草 JS onsubmit 事件：

document.querySelector("form.class-name").addEventListener("submit", function() {
  alert("I've been submitted.");
}, false);

你也可以使用event.preventDefault();方法来防止表单转到另一个页面，像这样：

$("form.class-name").on("submit", function(event) {
  even.preventDefault();
  alert("Do stuff");
});

Vanilla JS onsubmit 事件与 event.preventDefault(); 方法：

document.querySelector("form.class-name").addEventListener("submit", function(event) {
  event.preventDefault();
  alert("I've been submitted.");
}, false);

注意：当您使用 event.preventDefault(); 方法时，表单不会重定向到目标页面，即使您单击警告框中的 ok 按钮。

最后，您可以在提交按钮上使用 click 事件，如下所示：

$("button.submit-button-class").on("click", function() {
  alert("I've been clicked!");
});

香草 JS onclick 事件：

document.querySelector("button.submit-button-class").addEventListener("click", function() {
  alert("I've been clicked!");
}, false);

Answer 3

你可以使用下面的。

$("#FormSelector").on("submit", function() {
   //Your code goes here
});

创建一个警报，显示何时提交表单

creating an alert that shows when form is submitted

html

javascript

alert

function