延遲加載頁面，直到收到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呼叫

回答

相關問題