javascript - 在下拉列表中定义变量失败

Question

我正在创建我的第一个网站。

Firefox-Console:“速度未定义”，但为什么？ (“myvalues”的值是chart.js图表​​的数据。)

编辑:

var speed = "50";

window.test = function(e){

if(e.value=="Motor1"){
    alert(e.value);
     speed = "50";//call here any function
}
else if(e.value=="Motor2"){
    alert(e.value);
    speed = "30";//call here any function       
}
else if(e.value == "Motor3"){
    alert(e.value);
   speed = "90";//call here any function
}} 
   var myvalues = new Array();
   myvalues.push(speed);
   myvalues.push("10");
   myvalues.push("10");
   myvalues.push("10");
   myvalues.push("10");
   myvalues.push("10");
   myvalues.push("10");
   myvalues.push("10");
   myvalues.push("10"); 




      var data = {
       labels: ["Top-Speed", "Acceleration", "Cost", "Durability", "H", "R", "W", "T"],
    datasets: [

        {
            fillColor: "rgba(255, 0, 0, 0.31)",
            strokeColor: "rgb(221, 221, 221)",
            pointColor : "rgb(255, 255, 255)",
            pointStrokeColor : "#fff",
            borderWidth : "5000000000000",
            backgroundColor: "rgb(221, 221, 221)",
            data : myvalues 
        }
    ]
};



  var ctx = $("#canvas")[0].getContext("2d");
    var TestChart = new Chart(ctx, { type: 'radar',
                                     data: data,
                                     options: options});

    new Chart(ctx).Radar(data,options);  
  </script>

所以这里我在全局范围内声明了两个变量，对吗？我不再通过控制台收到任何错误消息，但我的图表不显示任何数据。如果我在全局范围内定义 var speed ="50"，它会显示输入的数据。所以改变var速度的功能不起作用。我不知道为什么。

感谢您的帮助!

Answer 1

您正在 If 范围内声明 speed 变量。

试试这个

window.test = function(e){
var speed;
if(e.value=="Motor1"){
    alert(e.value);
     speed = "50";//call here any function
}
else if(e.value=="Motor2"){
    alert(e.value);
    speed = "30";//call here any function       
}
else if(e.value == "Motor3"){
    alert(e.value);
   speed = "90";//call here any function
} 
   var myvalues = new Array();
   myvalues.push(speed);
   myvalues.push("10");
   myvalues.push("10");
   myvalues.push("10");
   myvalues.push("10");
   myvalues.push("10");
   myvalues.push("10");
   myvalues.push("10");
   myvalues.push("10"); 
}

编辑:

您编辑的代码不起作用，因为 window.test 是一个函数，并且它不会对文档执行过程。它只是创建一个可以在任何时候调用的函数，但不会调用它。由于 myvalues 变量在页面加载时作为数据源发送，因此它不会有适当的速度，因为您在图表之后调用了 window.test 函数已初始化。

您应该将图形初始化代码放在函数内，以便它与其余代码一起执行。 解决方案:

window.test = function(e) {
    var speed = "1"; //some default value

    if (e.value == "Motor1") {
        alert(e.value);
        speed = "50"; //call here any function
    } else if (e.value == "Motor2") {
        alert(e.value);
        speed = "30"; //call here any function       
    } else if (e.value == "Motor3") {
        alert(e.value);
        speed = "90"; //call here any function
    }
    var myvalues = new Array();
    myvalues.push(speed);
    myvalues.push("10");
    myvalues.push("10");
    myvalues.push("10");
    myvalues.push("10");
    myvalues.push("10");
    myvalues.push("10");
    myvalues.push("10");
    myvalues.push("10");




    var data = {
        labels: ["Top-Speed", "Acceleration", "Cost", "Durability", "H", "R", "W", "T"],
        datasets: [

            {
                fillColor: "rgba(255, 0, 0, 0.31)",
                strokeColor: "rgb(221, 221, 221)",
                pointColor: "rgb(255, 255, 255)",
                pointStrokeColor: "#fff",
                borderWidth: "5000000000000",
                backgroundColor: "rgb(221, 221, 221)",
                data: myvalues
            }
        ]
    };




    var ctx = $("#canvas")[0].getContext("2d");
    var TestChart = new Chart(ctx, {
        type: 'radar',
        data: data,
        options: options
    });

    new Chart(ctx).Radar(data, options);

}