मेरे पास यह बहुत ही बुनियादी स्क्रिप्ट है जो यूआरएल से छवि डेटा पकड़ती है और छवि के बारे में जानकारी को ली में प्रदर्शित करती है। स्क्रिप्ट काम करती है और wallpaper फ़ंक्शन को लगभग 10 बार कॉल किया जाता है लेकिन हर बार पेज को फिर से लोड करने पर ली आइटम का क्रम बदल जाता है। ठीक करने के लिए कोई रास्ता है?

यहाँ स्क्रिप्ट है, गन्दा कोड के लिए खेद है:

//wallpaper info mainlist ------------------------------------------------------------------------------
function wallpaper(url){
var id1= url.replace("https://drive.google.com/file/d/", "");
var id= id1.replace("/view?usp=sharing", "");
var mainlink =    "https://drive.google.com/uc?id=";
var thumbnail =   "https://drive.google.com/thumbnail?id=";
var download =    "https://drive.google.com/uc?export=download&id=";

$.getJSON("https://www.googleapis.com/drive/v2/files/" + id + "?key=------", function (gotData) {
//-----------------------------------------------------------------------------------------------  

//calculate date---------------------------------------------------------------------------------
myDate =           new Date(gotData.createdDate.slice(0, 10));
var options =      { year: 'numeric', month: 'long', day: 'numeric' };
var name=          gotData.originalFilename.slice(0, -4);
var maindata=      'File Size: ' + bytesToSize(gotData.fileSize) + '<br><br><br><br>' + 'Upload Date: ' + myDate.toLocaleString("en-US", options) + '<br><br><br><br>' + 'Wallpaper Dimensions: ' + gotData.imageMediaMetadata.width + 'x' + gotData.imageMediaMetadata.height;

//append data---------------------------------------------------------------------------------------
$('.mainlist').append("<li><a href='"+mainlink+id+"' data-lightbox='wallpaper1'><img class='icon' src='"+thumbnail+id+"'></a ><span>"+name+"</span><img class='button1' src='/images/info.png'><a href='#'><img class='button2' src='/images/download.png'></a><ul class='dropmenu'><p>"+maindata+"</p></ul>");


//ajax request--------------------------------------------------------------------------------------
var http =        new XMLHttpRequest();
var links =       { main: mainlink + id, thumb: thumbnail + id, dnload: encodeURIComponent(download) + id };
var data =        { Size: 'FileSize: ' + bytesToSize(gotData.fileSize), UploadDate: 'Upload Date: ' + myDate.toLocaleString("en-US", options), WallpaperDimensions: 'Wallpaper Dimensions: ' + gotData.imageMediaMetadata.width + 'x' + gotData.imageMediaMetadata.height };
var name =        { wallname: name };
var datajson =    JSON.stringify(data);
var linksjson =   JSON.stringify(links);
var namejson =    JSON.stringify(name);

http.open("POST", 'walldb.php', true);
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http.onload = function () {

      if (this.status == 200) {
        //console.log(this.responseText)
      }
    }
    http.send("links=" + linksjson + "&data=" + datajson + "&name=" + namejson);
})
}



//mainlist---------------------------------------
wallpaper("https://drive.google.com/file/d/1a4mib5pVOGIzBTxjGmvVwx-0uvK2NqaR/view?usp=sharing");
//-----------------------------------------------
wallpaper('https://drive.google.com/file/d/11xvntovifR7x6888LUcCKKCVhijwuds4/view?usp=sharing');
//-----------------------------------------------
wallpaper('https://drive.google.com/file/d/1JPN3uk5V_9z1i6RggiKFvAmX32Rz2uyC/view?usp=sharing');
//-----------------------------------------------
wallpaper('https://drive.google.com/file/d/1XdbEAMkm08qVC6k7AV3iE6Z1_XCwRgLU/view?usp=sharing');
//-----------------------------------------------
wallpaper('https://drive.google.com/file/d/1pgpRKV5GG2ANUec4QM5e0Lmo574vfRiM/view?usp=sharing');
//-----------------------------------------------
wallpaper('https://drive.google.com/file/d/1XDKdp1weajeKZyg6ai-cr0b-PRnyJqJ1/view?usp=sharing');
//-----------------------------------------------
wallpaper('https://drive.google.com/file/d/17YReCJoHa9MYrDMYjrPlMC_3cWuO5pIw/view?usp=sharing');
//-----------------------------------------------
wallpaper('https://drive.google.com/file/d/1zuX4j6FAEDyH0L-0RwhxCqh5Or8BY_9Z/view?usp=sharing');
//-----------------------------------------------
wallpaper('https://drive.google.com/file/d/1_iTXhka08y2f1UQHTulBayakSp-Ogn4f/view?usp=sharing');
//-----------------------------------------------
wallpaper('https://drive.google.com/file/d/1KAwemGXYHVwwPoaH2kL2-4UwxNgh6jDz/view?usp=sharing');
0
Ph4ntom 12 जिंदा 2020, 09:56
आप या तो सभी <li> पहले से बना सकते हैं, या आप Promise.all का उपयोग कर सकते हैं और कोड के मुख्य (सिंक्रोनस, ऑर्डर किए गए) भाग को चलाने से पहले प्रारंभिक getJSON के समाप्त होने की प्रतीक्षा कर सकते हैं।
 – 
CertainPerformance
12 जिंदा 2020, 10:25
मैं promise.all विधि कैसे करूँ? क्षमा करें, मैं वास्तव में जावास्क्रिप्ट के लिए नया हूँ
 – 
Ph4ntom
12 जिंदा 2020, 10:27

1 उत्तर

Promise.all विधि के लिए, क्योंकि आपको दोनों प्रतिक्रिया ऑब्जेक्ट की आवश्यकता है (आप इसे gotData कहते हैं) और URL से संबंधित कुछ, सामान्य विचार .promise() को getJSON कॉल पर कॉल करना है, और उस पर एक .then को चेन करना है जो डेटा और यूआरएल जो आपको चाहिए। फिर उन वादों की एक सरणी पर Promise.all पर कॉल करें, और उनमें से प्रत्येक के वापस आने पर प्रतिक्रियाओं को एक ही बार में पार्स किया जाएगा:

function wallpaper(url) {
  var id1 = url.replace("https://drive.google.com/file/d/", "");
  var id = id1.replace("/view?usp=sharing", "");
  return $.getJSON("https://www.googleapis.com/drive/v2/files/" + id + "?key=------")
    .promise()
    .then(response => ({ response, id }));
}

Promise.all(
    wallpaper("https://drive.google.com/file/d/1a4mib5pVOGIzBTxjGmvVwx-0uvK2NqaR/view?usp=sharing"),
    wallpaper('https://drive.google.com/file/d/11xvntovifR7x6888LUcCKKCVhijwuds4/view?usp=sharing'),
    wallpaper('https://drive.google.com/file/d/1JPN3uk5V_9z1i6RggiKFvAmX32Rz2uyC/view?usp=sharing'),
    // ...
  )
  .then((arr) => {
    arr.forEach(processResponse);
  });

function processResponse({ response, id }) {
  var mainlink = "https://drive.google.com/uc?id=";
  var thumbnail = "https://drive.google.com/thumbnail?id=";
  var download = "https://drive.google.com/uc?export=download&id=";

  var myDate = new Date(gotData.createdDate.slice(0, 10));
  // etc
0
CertainPerformance 12 जिंदा 2020, 10:46