दिलचस्प पोस्ट
अजगर में गतिशील (पैरामीट्रिजेड) यूनिट परीक्षण कैसे उत्पन्न करें? निर्धारित करें कि वर्तमान पावरशेफ प्रक्रिया 32-बिट या 64-बिट है? Base64 स्ट्रिंग के लिए एंड्रॉइड बिटमैप कोणीय 2: अपवाद / त्रुटि का सामना करने के बाद एप्लिकेशन क्रैश / अनुत्तरदायी हो जाता है Laravel स्थापना: अपने पाथ में ~ / .composer / विक्रेता / बिन निर्देशिका को कैसे रखें? सी और सी ++ के संदर्भ में स्थिर, ऑटो, वैश्विक और स्थानीय चर के बीच अंतर PyQt4: रनटाइम पर QWidget ऑब्जेक्ट को बदलें डीपेयर फ़ंक्शन के लिए तर्क दें नकारात्मक सूची सूचकांक? सी ++ मानक द्वारा अनुमत सदस्य चर के लिए कंस्ट्रक्टर आर्गुमेंट्स के समान नाम का उपयोग करने वाले सदस्य चर का उपयोग करना? मैं डैगर 2 त्रुटि कैसे ठीक करूं … … प्रदान नहीं की जा सकती '? टी-एसक्यूएल गतिशील पिवट SQL संग्रहित प्रक्रिया में temp तालिका में गतिशील एसक्यूएल परिणाम क्यों async कीवर्ड मौजूद है कर्ल के साथ $ _POST मान पासिंग

Jquery Ajax छवि लोड हो रहा है

मैं नीचे अपने jquery AJAX कोड (यह तब होता है जब jquery अभी भी प्रोसेसिंग) के लिए एक लोडिंग छवि को लागू करना मेरा कोड है:

$.ajax({ type: "GET", url: surl, dataType: "jsonp", cache : false, jsonp : "onJSONPLoad", jsonpCallback: "newarticlescallback", crossDomain: "true", success: function(response) { alert("Success"); }, error: function (xhr, status) { alert('Unknown error ' + status); } }); 

मैं इस कोड में एक लोडिंग छवि को कैसे लागू कर सकता हूं। धन्यवाद

Solutions Collecting From Web of "Jquery Ajax छवि लोड हो रहा है"

इस तरह से कुछ प्रयास करें:

 <div id="LoadingImage" style="display: none"> <img src="" /> </div> <script> function ajaxCall(){ $("#LoadingImage").show(); $.ajax({ type: "GET", url: surl, dataType: "jsonp", cache : false, jsonp : "onJSONPLoad", jsonpCallback: "newarticlescallback", crossDomain: "true", success: function(response) { $("#LoadingImage").hide(); alert("Success"); }, error: function (xhr, status) { $("#LoadingImage").hide(); alert('Unknown error ' + status); } }); } </script> 

विवरण

आपको ऐसा करना चाहिए jQuery.ajaxStart और jQuery.ajaxStop का उपयोग कर।

  1. अपनी छवि के साथ एक div बनाएँ
  2. इसे jQuery.ajaxStart में दिखाई jQuery.ajaxStart
  3. इसे jQuery.ajaxStop में छुपाएं

नमूना

 <div id="loading" style="display:none">Your Image</div> <script src="../../Scripts/jquery-1.5.1.min.js" type="text/javascript"></script> <script> $(function () { var loading = $("#loading"); $(document).ajaxStart(function () { loading.show(); }); $(document).ajaxStop(function () { loading.hide(); }); $("#startAjaxRequest").click(function () { $.ajax({ url: "http://www.google.com", // ... }); }); }); </script> <button id="startAjaxRequest">Start</button> 

अधिक जानकारी

  • jQuery.ajaxStart ()
  • jQuery.ajaxStop ()

थोड़ा देर हो चुकी है लेकिन यदि आप विशेष रूप से एक div का उपयोग नहीं करना चाहते हैं, तो मैं आमतौर पर इसे इस तरह करते हैं …

 var ajax_image = "<img src='/images/Loading.gif' alt='Loading...' />"; $('#ReplaceDiv').html(ajax_image); 

बदलें डीव एक div है जो अजाक्स भी सम्मिलित होता है। तो जब यह आता है, तो छवि को बदल दिया जाएगा

कृपया ध्यान दें कि: ajaxstart / ajaxStop AJAX jsonp अनुरोध के लिए काम नहीं कर रहा है (AJAX जेसन अनुरोध ठीक है)

मैं यह लिखते समय jquery 1.7.2 का उपयोग कर रहा हूं।

यहां संदर्भ में से एक है: http://bugs.jquery.com/ticket/8338