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

Question

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

我希望它显示BTC当量，当它加载而不是说'NaN'，它只工作时，我想分配变量价格静态整数，而不是动态的我是从bitcoinaverage的api拉动。

https://jsfiddle.net/7b2jaLxh/12/

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：你为什么不叫cadConvert在这个js？基本上只是等待数据，然后运行所有的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/