如果 onblur 返回 false，则阻止执行提交按钮中的 onclick 代码答案

【问题标题】：Prevent onclick code in submit button from executing if onblur returned false如果 onblur 返回 false，则阻止执行提交按钮中的 onclick 代码
【发布时间】：2017-05-26 08:54:22
【问题描述】：

文本字段如下所示：

<input type="text" id="nm" name="marks" value="60" onblur="return(myFunction())"/>

按钮如下所示：

<input type="submit" value="submit" onclick="val();" />

以下是我在 onblur 代码中的功能：

function myFunction() {
    var x = document.getElementById("nm");

    if(x.value>12) {
         alert("error");
         x.value="0";
         x.focus();

         return false;
    }
    return true;  
}

例如，如果用户更改 nm 文本字段的值并单击下一个文本字段，则必须显示警报（如果返回 false），但万一用户更改了 nm 字段的值然后点击提交按钮，那么如果onblur返回false，则提交按钮中onclick中的功能代码一定不能运行。目前，如果onblur返回false，则onclick中的函数会被执行。

请帮我解决一下。

【问题讨论】：

标签： javascript

【解决方案1】：

选项 A：

将 onBlur 函数的返回值保存到一个变量中，并在 val() 函数的开头访问它，以了解您是否必须执行其余代码。

选项 B：

在 onBlur 上以交互方式修改按钮元素。

id="button"的按钮

<input type="submit" id="button" value="submit" onclick="val();" />

新的 onBlur 功能：

function myFunction()

      {
         var x = document.getElementById("nm");
         var button = document.getElementById("button");
           if(x.value>12)
             {
               button.removeAttribute("onclick");
               alert("error");
               x.value="0";
               x.focus();
               return false;
             }
             button.setAttribute("onclick", "val();");
             return true;  
       }

请记住，这两个选项都需要一个有效的 onBlur() 和一个无效的 onClick 才能再次工作。

【讨论】：

非常感谢。有效。它节省了我很多时间。很长一段时间我都在想办法。

【解决方案2】：

我认为 onclcik 函数足以知道值是否大于 12

function val() {

    var x = document.getElementById("nm");

    if(x.value>12) {
         alert("error");
         x.value="0";
         x.focus();

         return false;
    }
    
    //do whatever you want 
    
    return true;  
}

<input type="text" id="nm" name="marks" value="60" />

<input type="submit" value="submit" onclick="val();" />

【讨论】：