提交按钮中有多个onClicks

Question

如果填写了所有必填字段，我有一个提交按钮，它将重定向到另一个页面。

<input type="submit" onclick="validateForm();redirect();" class="someClass" value="Submit" />

现在，当单击按钮时，它将调用这两个函数。 如果validateForm返回false，如何将其到达不调用重定向的地方？

如果有帮助，这是validateForm函数：

function validateForm(){
    var email = document.forms["form"]["Email"].value;
    if(email == null || email == ""){
        alert("Email must be filled out");
        return false;
    }
 }

Answer 1

<input type="submit" onclick="validateForm(); return false;" class="someClass" value="Submit" />

将输入更改为上面的代码。 还要更改您的功能以反映下面的代码。

function validateForm(){
    var email = document.forms["form"]["Email"].value;
    if(email == null || email == ""){
        alert("Email must be filled out");
        return false;
    }else {
        redirect();
    }
 }

Answer 2

添加一个onclick处理程序，例如validateAndRedirect ：

function validateAndRedirect()
{
    if(validateForm())
    {
        redirect();
    }
    else
    {
        return false;
    }
}

将此添加到按钮：

<input...onclick="validateAndRedirect()" ... >

此函数将调用validate() 。 如果验证失败，将返回false 。 如果为false则将阻止按钮的提交操作。 如果验证通过，它将调用redirect 。

Answer 3

使第一个函数调用下一个函数，并将其添加到您的HTML中：

  <input> type=button onclick="validateForm(); return false;" </input> 

设置“ return false”将阻止重定向，并为您的函数提供时间执行。

function validateForm(){
    var email = document.forms["form"]["Email"].value;
    if(email == null || email == ""){
        alert("Email must be filled out");
        return false;
    } else
     redirect();
 }

另外，我建议不要在HTML中放入任何代码。 这被认为是“不良做法”。 但是，如果您仍然想放置代码，则将其作为“ onsubmit”操作放入表单中将更为合适：

<form onsubmit="validateForm()">

如果希望函数在单击“提交”按钮时执行，则只需在脚本中添加事件侦听器和按钮的ID，如下所示：

var button = document.getElementById("submit");
button.onclick = function validateForm() { /*same code as above..*/ };

希望能帮助到你！