दिलचस्प पोस्ट
टेबल घटक की मदद से JRBeanCollectionDataSource डेटा कैसे दिखाया जाए? जावास्क्रिप्ट के साथ सभी कुकीज़ समाशोधन बड़ी फाइल की वजह से गीथहब को धक्का नहीं लगाया जा सकता है जो मैंने पहले से ही हटा दिया था मैं सीएमटी में प्रमाणित कैसे कर सकता हूँ सी # कोणीय जेएस सीएसएस एनीमेशन + कॉलबैक किया TFS विशिष्ट संस्करण अलग फ़ोल्डर में प्राप्त करें दोहराया सूचकांकों के साथ नॉर्मि सरणी बढ़ाना फ़ोर्स आईई 11 "यूजर एजेंट स्ट्रिंग" टैग्स का उपयोग कर अच्छा शुरुआती ट्यूटोरियल socket.io? सशर्त "ब्राउज़ करने योग्य" विशेषता मूल्यों के अनुसार हैशमैंट को सॉर्ट करना malloc कार्यान्वयन? शैल द्वारा उपयोग किए गए फ़ाइल आइकन प्राप्त करें समूह द्वारा व्यवहार के दौरान जब कोई समेकित कार्य SELECT खंड में मौजूद नहीं होता है पायथन इंटरप्रिटर का पूर्ण पथ खोजें?

एक अजाक्स प्रतिक्रिया से वापस जावास्क्रिप्ट फ़ंक्शन कॉल करना

मेरे पास एक ऐसी प्रणाली है जहां मैं एक अजाक्स कमांड भेजता हूं, जो उसमें फ़ंक्शन के साथ एक स्क्रिप्ट ब्लॉक देता है। इस डेटा को डीआईवी में सही ढंग से सम्मिलित करने के बाद, मैं आवश्यक क्रियाओं को पूरा करने के लिए इस फ़ंक्शन को कॉल करने में सक्षम होना चाहता हूं।

क्या यह संभव है?

Solutions Collecting From Web of "एक अजाक्स प्रतिक्रिया से वापस जावास्क्रिप्ट फ़ंक्शन कॉल करना"

मैं इस फार्म के तहत आपके प्रश्न को सही तरीके से समझाता हूं: "ठीक है, मैं पहले से ही सभी अजाक्स सामानों के साथ कर रहा हूं; मैं सिर्फ जानना चाहता हूं कि जावास्क्रिप्ट में मेरे अजाक्स कॉलबैक को डीआईवी में डालने के लिए उस क्षण से किसी भी समय कॉल करने योग्य है , अर्थात्, मैं इसे प्रासंगिक रूप से कॉलबैक रिटर्न में कॉल नहीं करना चाहता "।

ठीक है, अगर आप इसका मतलब कुछ हद तक उत्तर है, तो आप निम्न स्थितियों के तहत, ब्राउज़र के भीतर पृष्ठ के हठों के दौरान किसी भी समय अपने नए कोड को उस क्षण से जोड़ सकते हैं:

1) अजाक्स कॉलबैक द्वारा आपके जावास्क्रिप्ट कोड को वाकए ठीक से ठीक किया जाना चाहिए;
2) भले ही आपकी फ़ंक्शन घोषणा किसी मौजूदा <div> तत्व के अंदर एक <script> ब्लॉक में डाली गई हो, तो ब्राउजर को पता नहीं होगा कि नया फ़ंक्शन मौजूद है, क्योंकि घोषणा कोड कभी भी निष्पादित नहीं हुआ है। अतः, आपको एजाक्स कॉलबैक से लौटा eval() अपने घोषणा कोड को प्रभावी ढंग से अपने नए फ़ंक्शन को घोषित करने और पूरे पृष्ठ जीवनकाल के दौरान उपलब्ध होना चाहिए।

यहां तक ​​कि अगर काफी डमी, यह कोड इस विचार को बताता है:

 <html> <body> <div id="div1"> </div> <div id="div2"> <input type="button" value="Go!" onclick="go()" /> </div> <script type="text/javascript"> var newsc = '<script id="sc1" type="text/javascript">function go() { alert("GO!") }<\/script>'; var e = document.getElementById('div1'); e.innerHTML = newsc; eval(document.getElementById('sc1').innerHTML); </script> </body> </html> 

मैंने अजाक्स का उपयोग नहीं किया, लेकिन अवधारणा एक ही है (भले ही मुझे यकीन है कि चुना गया उदाहरण बहुत ज्यादा स्मार्ट नहीं है 🙂

आम तौर पर बोलते हुए, मैं आपके समाधान डिज़ाइन पर सवाल नहीं करता, यानी कि यह बाहरी या समानता के लिए अधिक या कम उपयुक्त है। फ़ंक्शन को एक अलग .js फ़ाइल और समान में, लेकिन कृपया ध्यान दें कि इस तरह के समाधान में और समस्याएं बढ़ सकती हैं, खासकर यदि आपके अजाक्स आविष्कार को दोहराना चाहिए, यानी अगर एक ही समारोह का संदर्भ बदलना चाहिए या यदि घोषित फ़ंक्शन दृढ़ता से संबंधित होना चाहिए, तो आपको इस धागे में सुझाए गए उदाहरणों में से किसी एक को अपना डिज़ाइन बदलने से गंभीरता से विचार करना चाहिए।

अंत में, अगर मैं आपके प्रश्न को गलत समझा, और जब आप अपने अजाक्स कॉलबैक की वापसी के दौरान फ़ंक्शन के प्रासंगिक आह्वान के बारे में बात कर रहे हैं, तो मेरा भाव क्रोसेंवल्ड द्वारा वर्णित प्रोटोटाइप दृष्टिकोण का सुझाव देना है, क्योंकि यह क्रॉस-ब्राउज़र, परीक्षण और पूरी तरह कार्यात्मक है, और यह आपको भविष्य के कार्यान्वयन के लिए एक बेहतर रोडमैप दे सकता है।

इनमें से कोई भी मेरे लिए काम नहीं करता

निम्नलिखित करता है!

एक वैकल्पिक हल ढूंढने में मुझे कुछ घंटों लग गए।

लौट एचटीएमएल / अजाक्स / जावास्क्रिप्ट फाइल के अंदर, आपके पास जावास्क्रिप्ट टैग होगा। इसे एक आईडी दें, जैसे कि रनक्रिप्ट इन टैगों के लिए आईडी जोड़ने में असामान्य है, लेकिन विशेष रूप से इसे संदर्भ देने के लिए आवश्यक है

 <script type="text/javascript" id="runscript"> alert("running from main"); </script> 

मुख्य विंडो में, फिर जावा कोड के नए ब्लॉक के मूल्यांकन के द्वारा eval फ़ंक्शन को कॉल करें (इस मामले में, इसे रनिप्टि कहा जाता है):

 eval(document.getElementById("runscript").innerHTML); 

और यह कम से कम Internet Explorer 9 और Google Chrome में काम करता है

यह पूरी तरह से संभव है, और इसके लिए कुछ खास वैध उपयोग के मामले भी हैं प्रोटोटाइप ढांचे का उपयोग निम्नानुसार किया गया है।

 new Ajax.Updater('items', '/items.url', { parameters: { evalJS: true} }); 

Ajax Updater के दस्तावेज़ीकरण देखें विकल्प सामान्य विकल्प सेट में हैं हमेशा की तरह, कुछ ऐसी चेतावनियां हैं जहां "यह" इंगित करता है, इसलिए ठीक प्रिंट पढ़ें।

जावास्क्रिप्ट कोड को भार पर मूल्यांकन किया जाएगा। यदि सामग्री में फ़ंक्शन myFunc(), तो आप वास्तव में केवल myFunc() बाद में कह सकते हैं शायद निम्नानुसार है

 if (window["myFunc"]) myFunc() 

यह जांचता है कि फ़ंक्शन मौजूद है या नहीं। हो सकता है कि किसी के पास एक बेहतर क्रॉस-ब्राउज़र तरीका है जो Internet Explorer 6 में काम करता है।

यह आपके कोड के लिए एक अजीब डिजाइन है – यह आमतौर पर आपके फ़ंक्शन को सीधे .js फ़ाइल से कहलाता है और फिर केवल अजाक्स कॉल के साथ डेटा पुनः प्राप्त करता है।

हालांकि, मेरा मानना ​​है कि प्रतिक्रिया पर eval () को कॉल करके काम करना चाहिए – बशर्ते वह वाक्यात्मक रूप से सही जावास्क्रिप्ट कोड है

JQuery के साथ मैं इसे getScript का उपयोग कर सकता हूं

बस याद रखें कि अगर आप एजेक्स के जरिए नीचे फ़ंक्शन बनाते हैं …

 function foo() { console.log('foo'); } 

… और इसे eval के माध्यम से निष्पादित करें, आपको शायद एक संदर्भ समस्या मिलेगी। इसे अपने कॉलबैक फ़ंक्शन के रूप में लें:

 function callback(result) { responseDiv = document.getElementById('responseDiv'); responseDiv.innerHTML = result; scripts = responseDiv.getElementsByTagName('script'); eval(scripts[0]); } 

आप फ़ंक्शन के अंदर किसी फ़ंक्शन को घोषित करेंगे, इसलिए यह नया फ़ंक्शन केवल उस दायरे पर पहुंच जाएगा।

यदि आप इस परिदृश्य में वैश्विक फ़ंक्शन बनाना चाहते हैं, तो आप इसे इस तरह से घोषित कर सकते हैं:

 window.foo = function () { console.log('foo'); }; 

लेकिन, मुझे भी लगता है कि आपको ऐसा नहीं करना चाहिए …

यहां किसी भी गलती के लिए क्षमा करें …

मैं जोड़ना चाहूंगा कि jQuery में एक एक्वल फंक्शन है जिससे आपको वैश्विक रूप से कोड को हटाने की अनुमति मिलती है जिसे आपको किसी भी प्रासंगिक समस्याओं से छुटकारा मिलना चाहिए। फ़ंक्शन को ग्लोबल एवल () कहा जाता है और यह मेरे उद्देश्यों के लिए बहुत अच्छा काम करता है। इसके दस्तावेज यहां पाये जा सकते हैं ।

यह jQuery एपीआई दस्तावेज़ीकरण द्वारा प्रदान किया गया उदाहरण कोड है:

 function test() { jQuery.globalEval("var newVar = true;") } test(); // newVar === true 

यह कार्य अत्यंत उपयोगी है जब बाहरी स्क्रिप्ट को गतिशील रूप से लोड करने की बात आती है जो आप जाहिरा तौर पर करने की कोशिश कर रहे थे।

ऐसी बात करने के लिए एक चेकलिस्ट:

  1. वापस अजाक्स प्रतिक्रिया eval (ed) है।
  2. फ़ंक्शन func_name = function() {...} में घोषित किए गए हैं

बेहतर अभी भी, ऐसे ढांचे का उपयोग करें जो इसे प्रोटोटाइप में पसंद करते हैं। आपके पास Ajax.updater

PHP पक्ष कोड फ़ाइल का नाम class.sendCode.php

 <?php class sendCode{ function __construct($dateini,$datefin) { echo $this->printCode($dateini,$datefin); } function printCode($dateini,$datefin){ $code =" alert ('code Coming from AJAX {$this->dateini} and {$this->datefin}');"; //Insert all the code you want to execute, //only javascript or Jquery code , dont incluce <script> tags return $code ; } } new sendCode($_POST['dateini'],$_POST['datefin']); 

अब अपने एचटीएमएल पेज से आपको डेटा भेजने के लिए एजेक्स फ़ंक्शन को ट्रिगर करना होगा।

 .... <script src="http://code.jquery.com/jquery-1.9.1.js"></script> .... Date begin: <input type="text" id="startdate"><br> Date end : <input type="text" id="enddate"><br> <input type="button" value="validate'" onclick="triggerAjax()"/> 

अब हमारे स्थानीय स्क्रिप्ट.जे में हम एजेक्स को परिभाषित करेंगे

 function triggerAjax() { $.ajax({ type: "POST", url: 'class.sendCode.php', dataType: "HTML", data : { dateini : $('#startdate').val(), datefin : $('#enddate').val()}, success: function(data){ $.globalEval(data); // here is where the magic is made by executing the data that comes from // the php class. That is our javascript code to be executed } }); } 

यह एक अच्छा विचार की तरह नहीं है।

आपको अजैक्स विधियों द्वारा दिए गए डेटा से अपने जावास्क्रिप्ट कोड के बाकी हिस्सों में शामिल करने के लिए फ़ंक्शन को बाहर करना चाहिए।

यद्यपि इसके लिए मूल्य है, (और मुझे समझ में नहीं आ रहा है कि आप एक डिवेल में एक स्क्रिप्ट ब्लॉक क्यों डाल रहे हैं?) यहां तक ​​कि एक स्क्रिप्ट ब्लॉक में लिखित इनलाइन स्क्रिप्ट विधियों तक पहुंच योग्य हो जाएगी।

मेरा सामान्य एजेक्स कॉलिंग फ़ंक्शन:

 function xhr_new(targetId, url, busyMsg, finishCB) { var xhr; if(busyMsg !== undefined) document.getElementById(targetId).innerHTML = busyMsg; try { xhr = new ActiveXObject('Msxml2.XMLHTTP'); } catch(e) { try { xhr = new ActiveXObject('Microsoft.XMLHTTP'); } catch(e2) { try { xhr = new XMLHttpRequest(); } catch(e3) { xhr = false; } } } xhr.onreadystatechange = function() { if(xhr.readyState == 4) { if(xhr.status == 200) { var target = document.getElementById(targetId) target.innerHTML = xhr.responseText; var scriptElements = target.getElementsByTagName("script"); var i; for(i = 0; i < scriptElements.length; i++) eval(scriptElements[i].innerHTML); if(finishCB !== undefined) finishCB(); } else document.getElementById(targetId).innerHTML = 'Error code: ' + xhr.status; } }; xhr.open('GET', url, true); xhr.send(null); // return xhr; } 

कुछ स्पष्टीकरण:
targetId एक (आमतौर पर div) तत्व आईडी होता है जहां targetId कॉल परिणाम पाठ जाता है।
url अजाक्स कॉल यूआरएल है।
busyMsg लक्ष्य तत्व में अस्थायी पाठ होगा।
finishCB को तब बुलाया जाएगा जब finishCB लेन-देन सफलतापूर्वक समाप्त हो गया।
जैसा कि आप xhr.onreadystatechange = function() {...} में देखते हैं, सभी <script> तत्वों को अजाक्स प्रतिक्रिया से एकत्र किया जाएगा और एक-एक करके चलाया जाएगा। यह मेरे लिए बहुत अच्छी तरह से काम करता है। दो अंतिम पैरामीटर वैकल्पिक है।

मैंने यह परीक्षण किया है और यह काम करता है समस्या क्या है? बस अपने जावास्क्रिप्ट तत्व के अंदर नया फ़ंक्शन डालें और फिर इसे कॉल करें। यह काम करेगा।

मैंने यहां दी गई सभी तकनीकों की कोशिश की, लेकिन अंततः जिस तरह से काम किया गया था, वह पृष्ठ / फ़ाइल के अंदर जावास्क्रिप्ट फ़ंक्शन को बस रखने के लिए किया गया था, जहां ऐसा होना चाहिए और इसे अजाक्स की प्रतिक्रिया से केवल एक समारोह के रूप में कॉल करना चाहिए:

 ... }, function(data) { afterOrder(); } 

यह पहला प्रयास पर काम किया, इसलिए मैंने साझा करने का निर्णय लिया।

यह कोड भी काम करता है, इसके बजाए एचटीएमएल की तरफ मैं सिर पर स्क्रिप्ट संलग्न करता हूं

 function RunJS(objID) { //alert(http_request.responseText); var c=""; var ob = document.getElementById(objID).getElementsByTagName("script"); for (var i=0; i < ob.length - 1; i++) { if (ob[i + 1].text != null) c+=ob[i + 1].text; } var s = document.createElement("script"); s.type = "text/javascript"; s.text = c; document.getElementsByTagName("head")[0].appendChild(s); } 

मैंने आज अपने जावास्क्रिप्ट को प्रतिक्रिया एचटीएमएल के निचले भाग में डालकर हल किया।

मेरे पास एक AJAX अनुरोध था जो उस HTML का एक समूह लौटा जो ओवरले में प्रदर्शित किया गया था। मुझे लौटने वाले प्रतिक्रिया HTML / ओवरले में एक बटन पर एक क्लिक ईवेंट संलग्न करना होगा। सामान्य पृष्ठ पर, मैं एक "window.onload" या "$ (document) .ready" में अपने जावास्क्रिप्ट को लपेटूंगा, ताकि वह नए ओवरले के लिए DOM के बाद डीओएम ऑब्जेक्ट को ईवेंट हैंडलर को जोड़ देगा, लेकिन क्योंकि यह एक AJAX प्रतिक्रिया थी और एक नया पेज लोड नहीं था, उस घटना को कभी नहीं हुआ, ब्राउज़र ने कभी मेरी जावास्क्रिप्ट निष्पादित नहीं की, मेरा ईवेंट हैंडलर कभी भी DOM तत्व से जुड़ा नहीं था, और मेरी नई कार्यक्षमता काम नहीं करती थी। दोबारा, मैंने "AJAX प्रतिक्रिया समस्या में जावास्क्रिप्ट निष्पादित करने" का हल "दस्तावेज़ (दस्तावेज़)" का उपयोग नहीं करके "दस्तावेज़" के शीर्ष पर, लेकिन दस्तावेज़ के अंत में मेरे जावास्क्रिप्ट को रखकर किया और इसे एचटीएमएल के बाद चलाया। / डोम प्रदान किया गया था

अगर आपकी AJAX स्क्रिप्ट चलाने के लिए कुछ मिलीसेकेंड से अधिक लेती है, तो एवल () हमेशा आगे चलकर खाली प्रतिक्रिया तत्व का मूल्यांकन करेगा इससे पहले कि AJAX उस स्क्रिप्ट के साथ पॉपुलेट करता है जिसे आप निष्पादित करने का प्रयास कर रहे हैं।

समय और eval () के साथ आसपास mucking के बजाय, यहाँ एक बहुत आसान समाधान है जो ज्यादातर स्थितियों में काम करना चाहिए और शायद थोड़ा अधिक सुरक्षित है ईवाल का प्रयोग करना आम तौर पर मूसलाधार होता है क्योंकि वर्णों को कोड के रूप में मूल्यांकन किया जा सकता है आसानी से ग्राहक-पक्ष में हेरफेर किया जा सकता है

संकल्पना

  1. मुख्य पृष्ठ में अपना जावास्क्रिप्ट फ़ंक्शन शामिल करें। इसे लिखिए ताकि किसी गतिशील तत्व को तर्क के रूप में स्वीकार किया जा सके।
  2. आपकी AJAX फ़ाइल में, किसी आधिकारिक डोम ईवेंट (ऑनक्लिक, ऑनफोकस, ऑनब्लूर, ऑनलोड, आदि) का उपयोग करके फ़ंक्शन बुलाएं। आपके प्रतिक्रिया में अन्य तत्वों के आधार पर, आप निर्बाध महसूस करने के बारे में बहुत चालाक प्राप्त कर सकते हैं। अपने गतिशील तत्वों को तर्क के रूप में पास करें
  3. जब आपका प्रतिक्रिया तत्व आबादी हो जाता है और घटना होती है, फ़ंक्शन चलता है।

उदाहरण

इस उदाहरण में, मैं पृष्ठ पर जोड़ा गया तत्व के बाद jquery-ui पुस्तकालय से एक गतिशील स्वत: पूर्ण सूची को एक AJAX तत्व से जोड़ना चाहता हूं। आसान, सही?

start.php

 <!DOCTYPE html> <html> <head> <title>Demo</title> <!-- these libraries are for the autocomplete() function --> <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/ui-lightness/jquery-ui.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script> <script type="text/javascript"> <!-- // this is the ajax call function editDemoText(ElementID,initialValue) { try { ajaxRequest = new XMLHttpRequest(); } catch (e) { try { ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { return false; }}} ajaxRequest.onreadystatechange = function() { if ( ajaxRequest.readyState == 4 ) { var ajaxDisplay = document.getElementById('responseDiv'); ajaxDisplay.innerHTML = ajaxRequest.responseText; } } var queryString = "?ElementID="+ElementID+"&initialValue="+initialValue; ajaxRequest.open("GET", "ajaxRequest.php"+queryString, true); ajaxRequest.send(null); } // this is the function we wanted to call in AJAX, // but we put it here instead with an argument (ElementID) function AttachAutocomplete(ElementID) { // this list is static, but can easily be pulled in from // a database using PHP. That would look something like this: /* * $list = ""; * $r = mysqli_query($mysqli_link, "SELECT element FROM table"); * while ( $row = mysqli_fetch_array($r) ) { * $list .= "\".str_replace('"','\"',$row['element'])."\","; * } * $list = rtrim($list,","); */ var availableIDs = ["Demo1","Demo2","Demo3","Demo4"]; $("#"+ElementID).autocomplete({ source: availableIDs }); } //--> </script> </head> <body> <!-- this is where the AJAX response sneaks in after DOM is loaded --> <!-- we're using an onclick event to trigger the initial AJAX call --> <div id="responseDiv"><a href="javascript:void(0);" onclick="editDemoText('EditableText','I am editable!');">I am editable!</a></div> </body> </html> 

ajaxRequest.php

 <?php // for this application, onfocus works well because we wouldn't really // need the autocomplete populated until the user begins typing echo "<input type=\"text\" id=\"".$_GET['ElementID']."\" onfocus=\"AttachAutocomplete('".$_GET['ElementID']."');\" value=\"".$_GET['initialValue']."\" />\n"; ?> 

फेडेरिको ज़ैंकन का उत्तर सही है लेकिन आपको अपनी स्क्रिप्ट को एक आईडी देना नहीं है और आपकी सभी स्क्रिप्ट को छोड़ देना नहीं है। बस अपने समारोह का नाम eval और इसे कहा जा सकता है।

हमारे प्रोजेक्ट में इसे प्राप्त करने के लिए, हमने अॉज़क्स प्रतिक्रिया के अंदर लौटा फ़ंक्शन को कॉल करने के लिए प्रॉक्सी फ़ंक्शन लिखा था।

 function FunctionProxy(functionName){ var func = eval(functionName); func(); }