JavaScript - 如果函数的值为 true，则启用提交按钮答案

【问题标题】：JavaScript - Enable submit button if function's value is trueJavaScript - 如果函数的值为 true，则启用提交按钮
【发布时间】：2016-01-06 21:47:42
【问题描述】：

我想仅在函数 func() 返回 true 时启用提交按钮，但我不知道如何从调用 onblur 事件的函数中获取值。除了 JavaScript，我不能使用任何东西。有人可以帮忙吗？

代码如下：

<script>

    function func(obj){
        if(obj.value.length > 4){
            alert("Longer than 4.");
            return false;
        } else if (obj.value.length < 2){
            alert("Shorter than 2.");
            return false;
        } else {
            return true;
        }
    }

</script>

<form method="" action="">

        <input type="text" name="text" id="text" onblur="func(this)"><br>
        <input type="submit" name="submit" value="Submit" disabled>

</form>

【问题讨论】：

标签： javascript html forms validation submit

【解决方案1】：

试试看

        function func(obj) {
            if (obj.value.length > 4) {
                alert("Longer than 4.");
                document.getElementById("submit").disabled = true;
                return false;
            } else if (obj.value.length < 2) {
                alert("Shorter than 2.");
                document.getElementById("submit").disabled = true;
                return false;
            } else {
                document.getElementById("submit").disabled = false;
                return true;
            }
        }

【讨论】：

这个成功了！但正如我所说，我主要关心的是如何获取函数的返回值，因为我将拥有多个函数，并且只有当这些函数都为真时，才能使用提交。

【解决方案2】：

    function func(obj) {
        if (obj.value.length > 4) {
            alert("Longer than 4.");
            return false;
        } else if (obj.value.length < 2) {
            alert("Shorter than 2.");
            return false;
        } else {
            document.getElementById("submitButton").removeAttribute("disabled");
            return true;
        }
    }

【讨论】：

感谢大家的回答！
好吧，我想它可以这样做，我试过了，但即使在一个错误的 if 之后，它也启用了提交，也许在一些“修补”之后。但我主要关心的是如何获取函数的返回值，因为我将拥有多个函数，并且只有当这些函数都为真时，才能使用提交。

【解决方案3】：

您可以使用按钮元素的disabled 属性。如果条件满足，则将其设置为 false。

如果 disabled 属性值为 true，则按钮禁用，否则启用。

function func(obj) {
  if (obj.value.length > 4) {
    alert("Longer than 4.");
  } else if (obj.value.length < 2) {
    alert("Shorter than 2.");
  } else {
    document.getElementById("submitButton").disabled = false; // Set to false for enable button
  }
}

<form method="" action="">

  <input type="text" name="text" id="text" onblur="func(this)">
  <br>
  <input type="submit" name="submit" id="submitButton" value="Submit" disabled>

</form>

子注释：

func 函数实际上没有做任何可以减少的返回值。

【讨论】：

【解决方案4】：

根据您提供的标准设置一个变量（以下代码中的“禁用”），然后将提交输入的禁用状态（我添加了一个 id）设置为该变量。

<script>

    function func(obj) {
        var disabled = true;
        if(obj.value.length > 4) {
            alert("Longer than 4.");
        } else if (obj.value.length < 2) {
            alert("Shorter than 2.");
        } else {
            disabled = false;
        }
        document.getElementById("subInp").disabled = disabled;
        return disabled;
    }

</script>

<form method="" action="">

        <input type="text" name="text" id="text" onblur="func(this)"><br>
        <input id="subInp" type="submit" name="submit" value="Submit" disabled>

</form>

【讨论】：