函数未在页面就绪时运行

Function not running at page ready

本文关键字：就绪 运行 函数      更新时间：2023-09-26

我有这样的代码集：

$(document).ready(function() {
     select_a_color();
});
function select_a_color(){
     var myColors = ["#441540",
     "#20A923",
     "#EF5918",
     "#E33EF3",
     "#C6452B",
     "#F94B34",
     "#236BD4",
     "#51A224",
     "#6E3372"];
     var gencolor = myColors[Math.round(Math.random() * (myColors.length - 1))];
     alert(gencolor);
}

每次调用该函数时，都应该将gencolor和（用于测试）alert更改为gencolor的值。我需要它在页面最初加载时运行，因为AJAX查询需要颜色，但我无法在页面加载时运行它。请注意，当它不是函数时，gencolor会正确生成。

我最终出现了未定义gencolor的错误。

我错过了什么？

UPDATE EDIT：做了一些更改，我让函数运行，但它无法正确传递变量gencolor。

var gencolor;
function selectColor(gencolor){
    var myColors = ["#441540",
        "#20A923",
        "#EF5918",
        "#E33EF3",
        "#B46BF9",
        "#D95AA3",
        "#622469",
        "#FB5AE8",
        "#51A224",
        "#6E3372"];
    var gencolor = myColors[Math.round(Math.random() * (myColors.length - 1))];
    alert(gencolor); //THIS WORKS!
}
function load_test_map2(gencolor) {
    selectColor();//THIS SUCCESSFULLY TRIGGERS THE FUNCTION AND ALERT WORKS
    console.log(gencolor); //THIS IS UNDEFINED
}

我试图将gencolor变量传递到另一个函数中，但它显然不起作用。

<!DOCTYPE html>
<html>
    <head>
        <title>test</title>
    </head>
    <body>

        <script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
        <script>
            $(document).ready(function() {
                select_a_color();
            });
        function select_a_color(){
        var myColors = ["#441540",
        "#20A923",
        "#EF5918",
        "#E33EF3",
        "#C6452B",
        "#F94B34",
        "#236BD4",
        "#51A224",
        "#6E3372"];
        var gencolor = myColors[Math.round(Math.random() * (myColors.length - 1))];
        console.log(gencolor);
        }
        </script>
    </body>
</html>

这样做，查看控制台并刷新页面，我得到以下输出：

#F94B34#51A224#E33EF3#F94B34..

所以它似乎起作用了。也执行console.log( message )而不是alert()。您是否在脚本之前包含jQuery？

我在您的编辑历史中看到原始代码是

function load_test_map2() {
    $(document).ready(function() {
        select_a_color();
    });
function select_a_color(){
var myColors = ["#441540",
"#20A923",
"#EF5918",
"#E33EF3",
"#C6452B",
"#F94B34",
"#236BD4",
"#51A224",
"#6E3372"];
var gencolor = myColors[Math.round(Math.random() * (myColors.length - 1))];
alert(gencolor);
}

只有两个错误

  1. 您忘记关闭load_test_map2()功能。但假设您只是忘记了复制大括号
  2. 您不必在load_test_map2中接下这两个函数，但如果需要，则需要调用它

试试这个Fiddle，它是对原始代码的修改

您有一些小错误——主要是在全局声明var gencolor之后，在selectColor函数内对其进行了declaration。

这很好用（看看这个小提琴）：

//global var
var gencolor;
$(document).ready(function() {
     load_test_map2();
});
function selectColor(){
     var myColors = ["#441540",
     "#20A923",
     "#EF5918",
     "#E33EF3",
     "#C6452B",
     "#F94B34",
     "#236BD4",
     "#51A224",
     "#6E3372"];
     // set the global var, don't redeclare it
     gencolor = myColors[Math.round(Math.random() * (myColors.length - 1))];
}
function load_test_map2() {
    selectColor();
    alert(gencolor); 
}
相关文章：