Zeigen Sie ein neues GIF auf jeder Seite besuchen oder Seite neu laden

Question

Ich benutze die GIPHY API, um ein Bild basierend auf einer Abfrage anzuzeigen. Unten ist der Code, den ich derzeit verwende, um das Bild zu ziehen. Es funktioniert, aber das Problem im Moment ist, dass jedes Mal, wenn Sie die Website besuchen, es jedes Mal das gleiche GIF zeigt, bis sich die Abfrage ändert. Was ich möchte ist, dass das GIF nach jedem Besuch aktualisiert wird oder dass die Seite in ein neues zufälliges Bild im Array geladen wird, selbst wenn die Abfrage die gleiche ist. Ich bin wirklich neu in Javascript und bin nicht sicher, wie Sie dieses Problem lösen, so dass jede Hilfe sehr geschätzt werden würde!

Hier ist die Funktion, die ich bin mit Daten

function weather(position) { 
    var apiKey = ''; 
    var url = ''; 
    var data; 
    // console.log(position); 
    $.getJSON(url + apiKey + "/" + position.coords.latitude + "," + position.coords.longitude + "?callback=?", function(data) { 

    $('.js-current-item1').html(Math.floor(data.currently.temperature) + '°'); 
    $('.js-current-item2').html(data.currently.summary); 

    gif(data.currently.icon) 
    city(position.coords.latitude + "," + position.coords.longitude) 

    }); 
} 

abzufragen Und hier ist die Funktion für Bilder von GIPHY ziehen

function gif(status) { 
    var apiKey = ''; 
    var url = 'http://api.giphy.com/v1/gifs/search?q='; 
    var query = status; 
    $.getJSON(url + query + apiKey, function(data) { 
    $('body').css('background-image', 'url(' + data.data[5].images.original.url + ')'); 
    }); 
} 

Answer 1

In Ihrer Funktion gif (Status), während die Bildeinstellung einen Zufallswert von Datenarray wählt anstelle von fester

Änderung

$('body').css('background-image', 'url(' + data.data[5].images.original.url + ')'); 

zu

var randomIndex = Math.floor(Math.random() * data.data.length); 
$('body').css('background-image', 'url(' + data.data[randomIndex].images.original.url + ')');