Javascript/JQuery/AJAX 否则如果不工作

Question

首先，我是初学者。我正在尝试找到解决我的问题的方法。基本上我希望我的文本是基于数字的不同颜色，所以我使用了 ELSE IF 语句。它有效，但它没有，我尝试了两种不同的方法。我使用 API 来基本显示数字（来自传感器的温度）

有关示例，请参阅 JFiddle，它还显示显示数字的其余代码。

http://jsfiddle.net/1brkww9h/98/

if (templr < 60) {
$("#displaylr").css("color", "#0000ff");
}
    else    if (templr < 70 && templr > 69) {
$("#displaylr").css("color", "#FFED00");
} else if (templr < 69 && templr > 68) {
    $("#displaylr").css("color", "#FFFC00");
} else if (templr < 68 && templr > 67) {
    $("#displaylr").css("color", "#EBEE12");
} else if (templr < 67 && templr > 66) {
    $("#displaylr").css("color", "#CFD42C");
} else if (templr < 66 && templr > 65) {
    $("#displaylr").css("color", "#ABB24A");
} else if (templr < 65 && templr > 64) {
    $("#displaylr").css("color", "#858C6C");
} else if (templr < 64 && templr > 63) {
    $("#displaylr").css("color", "#3D41AF");
} else if (templr < 63 && templr > 62) {
    $("#displaylr").css("color", "#0000FD");
} else if (templr < 62 && templr > 61) {
    $("#displaylr").css("color", "#424DFF");
} else {
    $("#displaylr").css("color", "#dddddd");

}

http://jsfiddle.net/1brkww9h/99/

if (templr < 1) {
   $("#displaylr").css("color", "#000000");
}
else if (templr = 69) {
  $("#displaylr").css("color", "#FFED00");
}
else if (templr = 68) {
  $("#displaylr").css("color", "#FFFC00");
}
else if (templr = 67) {
  $("#displaylr").css("color", "#EBEE12");
}
else if (templr = 66) {
  $("#displaylr").css("color", "#CFD42C");
}
else if (templr = 65) {
  $("#displaylr").css("color", "#ABB24A");
}
else if (templr = 64) {
  $("#displaylr").css("color", "#858C6C");
}
else if (templr = 63) {
  $("#displaylr").css("color", "#3D41AF");
}
else if (templr = 62) {
  $("#displaylr").css("color", "#0000FD");
}
else if (templr = 61) {
  $("#displaylr").css("color", "#424DFF");
}
else {
  $("#displaylr").css("color", "#dddddd");

}

Answer 1

您的 templr 变量是一个 jQuery 对象，而不是一个数字。

jObject.text(var) 将返回 jObject，jObject.text() 将返回 jObject 内的文本。

您需要更改您的代码

var templr = $("#displaylr").text(((retval.d.temp_degC * 1.8) + 32).toFixed(1));

到

var templr = (retval.d.temp_degC * 1.8) + 32;
$("#displaylr").text(templr.toFixed(1));

另外，if 语句中的条件更新匹配整数，仅介于两者之间。

数字 65 和 64 将得到 #dddddd，但数字 64.1 到 64.9 将得到 #858C6C。

如果你只想要60到70之间的蓝黄色渐变，可以使用这个函数

function get_color(num, min_val, min_color, max_val, max_color)
{
    if (num <= min_val)
        return "rgb("+min_color.join(",")+")";
    if (num >= max_val)
        return "rgb("+max_color.join(",")+")";
    var t = (num-min_val)/(max_val-min_val);
    var color = [0,0,0];
    for (var j=0; j<3; j++)
        color[j] = Math.floor(min_color[j]*(1-t) + max_color[j]*t);
    return "rgb("+color.join(",")+")";
}

然后您可以将所有if 语句替换为

$("#displaylr").css("color", get_color(templr, 60, [0x00,0x00,0xFF], 70, [0xFF,0xFF,0x00]));