Question

当我加载页面时，我想运行 cadConvert（）函数，因此它根据CAD值计算滑块设置的BTC值，但只有在我更改/更新时才会这样做cad的值或移动滑块...

我希望它在加载时显示BTC等效而不是说'NaN'，它只能在我为变量价格分配一个静态整数而不是我正在拉动的动态整数时按预期工作来自bitcoinaverage的api。

 var directionSlider = document.getElementById('slider-direction');

 noUiSlider.create(directionSlider, {
   start: 20,
   connect: [true, false],
   direction: 'ltr',
   range: {
     'min': 2,
     'max': 99.99
   }
 });
 var price;
 var cadc = document.getElementById('cadc');
 var btcc = document.getElementById('btcc');

 directionSlider.noUiSlider.on('update', function(values, handle) {
   cadc.value = directionSlider.noUiSlider.get();
   cadConvert();
 });

 cadc.addEventListener('change', function() {
   directionSlider.noUiSlider.set(this.value);
   cadConvert();
 });
 btcc.addEventListener('change', function(e) {
   directionSlider.noUiSlider.set(this.value * price);
   cadConvert();

 });

 function cadConvert() {
   var cad = parseFloat(directionSlider.noUiSlider.get());
   var cadCalc = cad / price;
   document.getElementById("btcc").value = cadCalc;

 }

Answer 1

从你的jsfiddle：你为什么不在这个js中调用cadConvert？基本上只是等待数据，然后运行所有的JavaScript代码。这样，价格将在检索数据后定义。

var xbtc = new XMLHttpRequest();
xbtc.open('GET', 'https://api.bitcoinaverage.com/ticker/global/CAD/', true);
xbtc.onreadystatechange = function(){
    if(xbtc.readyState == 4){
        var ticker = JSON.parse(xbtc.responseText);
        price = ticker.last;
        document.getElementById('btc').innerHTML = "Global Market: $" + (price).toFixed(2) + " CAD";
        cadConvert();
    }
};
xbtc.send();

Answer 2

您遇到此问题的原因是price最初未定义！始终初始化varibales是一个好习惯！第27行，您可以将价格设置为默认值directionSlider var price = directionSlider.noUiSlider.get();

https://jsfiddle.net/wt0asmqe/

函数在页面加载时返回NaN，但在更改/更新正常工作时，如何解决？

2 个答案: