Question

为什么说我没有定义我的功能？是因为我已将我的功能放在文件就绪功能中吗？ - 也许我必须提一下，如果我的陈述不正确，我想使用这个函数来阻止提交。

我在html中的表单标记：

<form class="text-left" method="post" action="" onsubmit="return myFunction();">

下面是

脚本（这个脚本在我的脑子里）：

$( document ).ready(function() {

    //the number generators and sum of the two numbers
    var numberOne = Math.floor((Math.random() * 10) + 1); 
    var numberTwo = Math.floor((Math.random() * 10) + 1);
    var sum = numberOne + numberTwo;

    //write the math question to the div
    document.getElementById("captchaOutput").innerHTML = numberOne+ " og " +numberTwo;
    //alert(sum);

    function myFunction(){
        var humanInput = $('#captchaInput').val();

        if(humanInput == sum){

            $("#captcha_service_err").css("display", "inline")
            $("#captchaInput").css("border-color", "red");
             return false;
        }
             $("#captcha_service_err").css("display", "none")
        $("#captchaInput").css("border-color", "");
        return true;       
    }  
});

Answer 1

因为我已将我的功能放在文件就绪功能中？

是。函数声明（如var语句）作用于它们声明的函数。

如果你想将myFunction用作全局，那么移动它，以及它所依赖的变量，用你声明它的匿名函数。

或者，您可以显式创建引用它的全局：

window.myFunction = myFunction

然而，最好的解决方案是首先不使用全局。

删除onsubmit属性，然后使用JavaScript绑定事件处理程序。

$('form').on('submit', myFunction);

确保捕获事件对象：

function myFunction(e){

如果您不希望提交，请阻止默认表单提交行为：

$("#captchaInput").css("border-color", "red");
e.preventDefault();

Answer 2

这是因为myFunction是在$(document).ready的范围内定义的，而在外面不可见。在外面定义它及其因变量

//the number generators and sum of the two numbers
var numberOne = Math.floor((Math.random() * 10) + 1);
var numberTwo = Math.floor((Math.random() * 10) + 1);
var sum = numberOne + numberTwo;
$(document).ready(function() {
    //write the math question to the div
    document.getElementById("captchaOutput").innerHTML = numberOne + " og " + numberTwo;
    //alert(sum);
});

function myFunction() {
    var humanInput = $('#captchaInput').val();

    if (humanInput == sum) {

        $("#captcha_service_err").css("display", "inline")
        $("#captchaInput").css("border-color", "red");
        return false;
    }
    $("#captcha_service_err").css("display", "none")
    $("#captchaInput").css("border-color", "");
    return true;
}

<强>更新

删除表单的内嵌onsbumit并使用on()，如下所示

$( document ).ready(function() {

    //the number generators and sum of the two numbers
    var numberOne = Math.floor((Math.random() * 10) + 1); 
    var numberTwo = Math.floor((Math.random() * 10) + 1);
    var sum = numberOne + numberTwo;

    //write the math question to the div
    document.getElementById("captchaOutput").innerHTML = numberOne+ " og " +numberTwo;
    //alert(sum);

    $('form').on('submit', function(){
        var humanInput = $('#captchaInput').val();

        if(humanInput == sum){

            $("#captcha_service_err").css("display", "inline")
            $("#captchaInput").css("border-color", "red");
             return false;
        }
             $("#captcha_service_err").css("display", "none")
        $("#captchaInput").css("border-color", "");
        return true;       
    });  
});

Answer 3

在此处尝试使用window对象：

$( document ).ready(function() {
    //the number generators and sum of the two numbers
    var numberOne = Math.floor((Math.random() * 10) + 1); 
    var numberTwo = Math.floor((Math.random() * 10) + 1);
    var sum = numberOne + numberTwo;

    //write the math question to the div
    document.getElementById("captchaOutput").innerHTML = numberOne+ " og " +numberTwo;
    //alert(sum);

    window.myFunction = function () {
        var humanInput = $('#captchaInput').val();

        if(humanInput == sum){

            $("#captcha_service_err").css("display", "inline")
            $("#captchaInput").css("border-color", "red");
             return false;
        }
             $("#captcha_service_err").css("display", "none")
        $("#captchaInput").css("border-color", "");
        return true;       
    }  
});

Answer 4

    var sum = 0;
    $( document ).ready(function() {

            //the number generators and sum of the two numbers
            var numberOne = Math.floor((Math.random() * 10) + 1); 
            var numberTwo = Math.floor((Math.random() * 10) + 1);
            sum = numberOne + numberTwo;

            //write the math question to the div
            document.getElementById("captchaOutput").innerHTML = numberOne+ " og " +numberTwo;
            //alert(sum);


        });

       function myFunction(){
                var humanInput = $('#captchaInput').val();

                if(humanInput == sum){

                    $("#captcha_service_err").css("display", "inline")
                    $("#captchaInput").css("border-color", "red");
                     return false;
                }
                     $("#captcha_service_err").css("display", "none")
                $("#captchaInput").css("border-color", "");
                return true;       
            }

onsubmit函数未定义

4 个答案: