我想每分钟更新我页面上的股票价格,并在不刷新页面的情况下显示新价格。你能帮我怎么做吗。
$(function () {
var stocks = [];
var symbols = ['AAPL', 'MSFT'];
symbols.forEach(symbol => makeAjaxCall(symbol));
function makeAjaxCall(param) {
$.ajax({
type: "GET",
url: "https://www.alphavantage.co/query?function=TIME_SERIES_INTRADAY&symbol=" + param + "&interval=1min&apikey=8TKKZE0GET944FMW",
success: function (result) {
stocks = result;
getPrices();
}
});
}
function getPrices() {
var metaData = stocks["Meta Data"],
timeSeries = stocks["Time Series (1min)"],
symbol = metaData["2. Symbol"];
var priceList2 = '';
Object.getOwnPropertyNames(lastDate).forEach(function (val, idx, array) {
priceList += val + ': ' + lastDate[val] + '<br>';
});
document.getElementById("demo").innerHTML += '<div class="eachStock"><a href="#" data-stock="' + symbol + '">' + symbol + '</a></div><div>' + priceList + '</div>';
}
});
我的 html 文件:
<div id="demo"></div>
谢谢!
首先将所有代码包装在一个函数调用中:
const loadData = () => {
var stocks = [];
var symbols = ['AAPL', 'MSFT'];
symbols.forEach(symbol => makeAjaxCall(symbol));
function makeAjaxCall(param) {
$.ajax({
type: "GET",
url: "https://www.alphavantage.co/query?function=TIME_SERIES_INTRADAY&symbol=" + param + "&interval=1min&apikey=8TKKZE0GET944FMW",
success: function (result) {
stocks = result;
getPrices();
}
});
}
function getPrices() {
var metaData = stocks["Meta Data"],
timeSeries = stocks["Time Series (1min)"],
symbol = metaData["2. Symbol"];
var priceList2 = '';
Object.getOwnPropertyNames(lastDate).forEach(function (val, idx, array) {
priceList += val + ': ' + lastDate[val] + '<br>';
});
document.getElementById("demo").innerHTML += '<div class="eachStock"><a href="#" data-stock="' + symbol + '">' + symbol + '</a></div><div>' + priceList + '</div>';
}
};
您需要确保它可以被多次调用,其中它不能附加值,而是替换(只需在开头清除 div,例如document.getElementById("demo").innerHTML = ''
)。然后,您可以使用setInterval经常调用您的函数。不要忘记仅在页面加载时启动它(您使用的是 jquery,还有其他选项):
const TIME = 2 * 1000; // time in millis for next update
$(() => {
loadData();
setInterval(loadData, TIME);
});
请注意,如果请求花费的时间超过TIME
,您可能会遇到并发问题。要获得更好的解决方案,请查看Promises。他们将允许更清晰的代码。
如果您仅使用 jquery 进行请求和“已加载页面”事件,您可能需要学习更新的替代方案(如Fetch API和此事件)。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句