延迟加载页面，直到收到AJAX呼叫

我有一个计算比特币挖掘盈利能力的程序，因此需要比特币的实时价格，但我也希望用户能够编辑最初加载后的价格现场价格。延迟加载页面，直到收到AJAX呼叫

我遇到的问题是，当我运行我的代码时，bpv最初是未定义的，即使应该在加载正文时调用它，theres没有问题与ajax调用，因为一旦运行更新后正文加载，bpv被定义。

我怀疑这是因为ajax调用需要比加载页面花费的时间更长，而bpv未定义，那么当我运行update（）时，代码已经初始化，因此不会有任何延迟。

我也怀疑会解决这个问题，将使页面等待加载，直到ajax调用已被发回，但我无法想象这是可扩展的吗？

我对此很新，所以请尽量轻松一点，谢谢。

<head> 
var bpv; 
function update(){ 
getVal(); 
getPrice(); 
function getPrice(){ 
    $.ajax({ 
     dataType:"json", 
     type: 'GET', 
     url:'https://blockchain.info/ticker', 
      success: function(data){ 
       bpv = data.USD.last;  
      } 

    }); 
} 

} 

</head> 
<body onload = "update()" > 
<script> 
function getVal(){ 
//Current Value of Bitcoin 
     bpv = document.getElementById("bp").value; 
</script> 
Value of Bitcoin ($)<br/> 
     <input type="text" id="bp" onKeyDown="getVal()" onKeyUp="getVal()" value="" ><br/>

编辑：我使用Alex的解决方案，尽管它仅固定显示未定义的输入，而不是计算的最终结果，因此，如果实现在我再次，0.1秒运行的计算的非常janky溶液在页面加载后，如果有人卫生组织比我聪明知道一个更好的解决方案我的耳朵是敞开

来源

2017-10-09 Donkeypunter

您应该使用承诺。 – SLaks

[我如何从异步调用返回响应？]（https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call） – Liam

Ajax调用的值是异步的。因此，在呼叫完成时，页面的其余部分将始终执行。我不太确定你所要完成的是什么，但如果你希望显示在输入框中输入比特币的价值，然后让用户更改它的加载后，你可以遵循这样的：

从禁用输入框开始;
通过AJAX调用加载比特币;
将响应价格设置到字段中;
启用该字段，以便用户可以编辑;

这可能看起来像：（代码例证的，我取出一部分，但如果你有任何问题，让我知道）

<head> 
    <script> 
    var bpv; 
    document.addEventListener("DOMContentLoaded", function(event) { 
    getPrice(); 
    }); 

    function getPrice(){ 
    $.ajax({ 
     dataType:"json", 
     type: 'GET', 
     url:'https://blockchain.info/ticker', 
     success: function(data){ 
     bpv = data.USD.last; 
     setPriceInput(bpv);  
     } 
    }); 
    } 

    function setPriceInput(value) { 
    var input = document.getElementById('bp'); 
    input.value = value; 
    input.disabled = false; 
    } 
    </script> 
    </head> 
    <body> 
    Value of Bitcoin ($)<br/> 
    <input type="text" id="bp" value="" disabled> 
    </body>

https://jsfiddle.net/81oqsk5x/1/

该解决方案将等待要呈现页面，然后尝试获取价格。一旦价格从API响应，它将在输入上设置价格并再次启用它（如果您查看输入元素，它将从禁用开始）

来源

2017-10-09 21:51:26

我已经实现了该代码，谢谢，但是我也运行了一个带有该bpv的计算，而输入框保持正确的值，计算看到bpv为未定义，不知道我怎么去解决这个问题？ – Donkeypunter

@Donkeypunter这是一个更具体的问题。如果您可以将代码粘贴到jsfiddle上，我可以解决您的问题并尝试提出解决方案 –

-1

始终把就绪功能

$(document).ready(function(){ 
    // your code here 
});

来源

2017-10-09 21:44:45

这与问题无关。 – SLaks

这是问题伙伴中的全部问题 –

否;他想等待AJAX结果。 – SLaks

左右的时间内您的jQuery代码一对夫妇次英格斯。

您的第一个标记是无效的。头标签需要包含适当的内容。 https://developer.mozilla.org/en-US/docs/Web/HTML/Element/head
将所有的脚本标签
function getVal(){内的JavaScript的格式不正确，有无效的语法。你缺少一个右括号
而不是试图设置BPV您做出AJAX调用后，更新DOM document.getElementById("bp").value = data.USD.last

来源

2017-10-09 21:49:46 d3l33t

我应该指定我只是删除了这些代码的相关部分，但是当我加载我的页面时，它不会遇到任何错误 – Donkeypunter

延迟加载页面，直到收到AJAX呼叫

回答

相关问题