2017-09-03 2 views
0

Ma tâche était d'écrire une fonction qui obtient des échanges Bitcoin de lien JSON, changer l'intervalle avec les boutons, ajouter la flèche fontawesome haut/bas/ligne dépend si le taux monte/descend/pas de changement et l'afficher le site Web.Bitcoin ticker + fontawesome

J'ai tout sauf fontawesome ...

Mon code HTML est:

<h3>Bitcoin to PLN</h3> 
<h4>Buy</h4> 
<div id="buy"><p></p></div> 
<h4>Sell</h4> 
<div id="sell"><p></p></div> 
<h4>Refresh in:</h4> 

<form name="timerBtn"> 
<input type="button" class="button" id="btn5" value="5 s"> 
<input type="button" class="button" id="btn10" value="10 s"> 
<input type="button" class="button" id="btn30" value="30 s"> 
<input type="button" class="button" id="btn60" value="60 s"> 
</form> 

<p id="timer">Refreshing in 5 sekund</p> 

Et JS:

$("form").click(function(getTimer) { 
    if (getTimer.target.className === 'button') { 

     $("p#timer").empty(); 

     var timer = $("p#timer").append("Refresh in " + getTimer.target.value); 

    } 
    return timer 
}); 

function startRefresh() { $.getJSON("https://blockchain.info/pl/ticker", function (data) { 
     $("#buy").html(data.PLN.buy); 
     $("#sell").html(data.PLN.sell); 
     console.log ("reupload"); 
});  

} 

setTimer = setInterval(startRefresh, 5000); 

$("input#btn5").click(function() { 
    clearInterval(setTimer); 
    setTimer = setInterval(startRefresh, 5000); 

}); 

$("input#btn10").click(function() { 
    clearInterval(setTimer); 
    setTimer = setInterval(startRefresh, 10000); 

}); 

$("input#btn30").click(function() { 
    clearInterval(setTimer); 
    setTimer = setInterval(startRefresh, 30000); 

}); 

$("input#btn60").click(function() { 
    clearInterval(setTimer); 
    setTimer = setInterval(startRefresh, 60000) 

}); 

Je ne sais pas comment faire face à fontawesome partie

Merci d'avance pour toute conseils

+0

Il y a des exemples [sur la police Impressionnant] (http://fontawesome.io/examples/) site. – Tigger

+0

Ok, mais comment changer la flèche si la valeur affichée est plus grande/plus basse que la valeur avant l'actualisation? –

Répondre

1

polices impressionnante flèche vers le haut apparaît comme ceci:

<i class="fa fa-arrow-up"></i> 

Je stockerait tous ces extraits HTML (haut, bas et pas de changement) dans leurs propres variables.

upArrow = '<i class="fa fa-arrow-up"></i>' 

Et puis les injecter lorsque vous injectez le HMTL dans la fonction startRefresh comme ceci:

$("#buy").html(upArrow + data.PLN.buy);