AddEventListener श्रोता फ़ंक्शन में तर्क कैसे पास करें?

Question

स्थिति कुछ इस तरह है-

var someVar = some_other_function();
someObj.addEventListener("click", function(){
    some_function(someVar);
}, false);

समस्या यह है कि इसका मान someVarश्रोता कार्य के अंदर दिखाई नहीं देता है addEventListener, जहाँ शायद इसे एक नए चर के रूप में माना जा रहा है।

Comments

इस मामले पर एक बहुत ही स्पष्ट लेख: toddmotto.com/avoiding-anonymous-javascript-functions

— नोबिता

सबसे साफ तरीका नहीं है, लेकिन काम करता है। ध्यान दें कि अगर someVar केवल अंक या पाठ हो सकता है: eval ('someObj.addEventListener ("क्लिक", फ़ंक्शन) () {some_function (' + someVar + ');}););

— इग्नास 2526

बस आज यह मुद्दा था - यहाँ दिया गया समाधान सही है (अन्य समाधानों में लूप इश्यू के लिए जैसे मुद्दे हैं, इत्यादि) - stackoverflow.com/a/54731362/984471

— मनोहर रेड्डी Poreddy

Answer 1

आपके द्वारा लिखे गए कोड में कुछ भी गलत नहीं है। दोनों some_functionऔर someVarसुलभ होना चाहिए, मामले में वे जहां संदर्भ में उपलब्ध गुमनाम थे

function() { some_function(someVar); } 

बनाया गया था।

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

var someVar; 
someVar = some_other_function();
alert(someVar);
someObj.addEventListener("click", function(){
    some_function(someVar);
}, false);

Comments

यह लूप के लिए काम नहीं करता है। मुझे हमेशा नवीनतम मूल्य मिलता है, न कि जो उस पुनरावृत्ति का था। कोई भी समाधान?

— iMatoria

किसी को पता है कि यह लूप में काम क्यों नहीं करता है? उस व्यवहार का कारण क्या है?

— मॉर्फिडन

@Morfidon क्योंकि वैश्विक चर के साथ कार्य जावास्क्रिप्ट में क्लोजर के रूप में कार्य करता है जिसका अर्थ है कि वे अपने शाब्दिक दायरे के बाहर के वातावरण को याद करते हैं। यदि आप केवल एक ही वातावरण में अलग-अलग फ़ंक्शन बनाते हैं तो वे उसी वातावरण का संदर्भ देंगे।

— बुग्यालबेल

@ मॉर्फिडॉन: एक लूप में, someVar का मान वैसा नहीं होता है जैसा कि श्रोता को जोड़ा जाता था, लेकिन जब श्रोता निष्पादित होता है तो उसका मूल्य होता है। जब श्रोता को निष्पादित किया जाता है, तो लूप पहले ही समाप्त हो गया है, इसलिए लूप के समाप्त होने पर someVar के मूल्य का मूल्य होगा।

— www.admiraalit.nl

@iMatoria मैं सिर्फ इतना है कि एक बनाने की खोज की है bound functionका उपयोग करते हुए .bind()विधि छोरों के साथ इस मुद्दे का समाधान होगा developer.mozilla.org/en/docs/Web/JavaScript/Reference/...

— ल्यूक टी ओ ब्रायन

Answer 2

घटना के लक्ष्य विशेषता से सिर्फ तर्क क्यों नहीं मिलता है?

उदाहरण:

const someInput = document.querySelector('button');
someInput.addEventListener('click', myFunc, false);
someInput.myParam = 'This is my parameter';
function myFunc(evt)
{
  window.alert(evt.currentTarget.myParam);
}

<button class="input">Show parameter</button>

जावास्क्रिप्ट एक प्रोटोटाइप-उन्मुख भाषा है, याद रखें!

Comments

यह सही उत्तर है क्योंकि यह हमें 'removeEventListener' फ़ंक्शन के बाद उपयोग करने देता है।

— user5260143 12

यह नहीं होना चाहिए evt.currentTarget.myParam? यदि 'someInput' के अंदर कोई दूसरा तत्व है, तो evt.targetहो सकता है कि वह आंतरिक तत्व को संदर्भित करे। ( jsfiddle.net/qp5zguay/1 )

— हरबर्टसज

यह संरक्षित करता है this! टाइपस्क्रिप्ट में इस पद्धति का उपयोग करने के लिए तत्व की आवश्यकता होती है anyया हालांकि एक उप प्रकार बनाने के लिए।

— ओल्ड बैडमैन ग्रे

मेरे चर अपरिभाषित के रूप में वापस आ रहे हैं ... कैसे ठीक करने के बारे में कोई विचार?

— नोमम

अगर addEventListenerहै document, evt.target.myParamतो मेरे लिए काम नहीं किया। मुझे evt.currentTarget.myParamइसके बजाय उपयोग करना था।

— तुरकिन_34

Answer 3

यह प्रश्न पुराना है, लेकिन मैंने सोचा था कि मैं ES5 के .bind () - पोस्टीरिटी के लिए विकल्प का उपयोग करूँगा। :)

function some_func(otherFunc, ev) {
    // magic happens
}
someObj.addEventListener("click", some_func.bind(null, some_other_func), false);

बस इस बात से अवगत रहें कि आपको पहले श्रोता के साथ अपने श्रोता समारोह को स्थापित करने की आवश्यकता है क्योंकि तर्क आप बाँध (आपके अन्य समारोह) में पास कर रहे हैं और दूसरा परम अब घटना है (पहले के बजाय, जैसा कि होता) ।

Comments

फंक्शन.प्रोटाइप.बिंड () वास्तव में इस मुद्दे को हल करने का सबसे अच्छा तरीका है। इसके अलावा, यह सहज रूप से छोरों के अंदर काम करता है - आपको जो लेक्सिकल स्कोप चाहिए वह मिलता है। कोई अनाम फ़ंक्शंस, IIFE , या विशेष गुण वस्तुओं पर नहीं लगाए गए ।

— क्लिंट पाचल

IIFE बनाम बाइंड () के पेशेवरों और विपक्षों को देखें ।

— क्लिंट पाचल

उपयोग करके Function.prototype.bind()आप इवेंट श्रोता को हटा नहीं सकते , इसके बजाय एक करी फ़ंक्शन का उपयोग करने के लिए बेहतर है (@ tomcek112 उत्तर देखें)

— pldg

नोट: some_other_funcएक चर है, आप जो भी मान चाहते हैं उसे पारित कर सकते हैं some_func।

— १

Answer 4

आप केवल 'बाइंड' के साथ सभी आवश्यक तर्क बाँध सकते हैं:

root.addEventListener('click', myPrettyHandler.bind(null, event, arg1, ... ));

इस तरह आप हमेशा मिल जाएगा event, arg1करने के लिए पारित किया है, और अन्य सामग्री myPrettyHandler।

http://passy.svbtle.com/partial-application-in-javascript-using-bind

Comments

धन्यवाद! पहले ही कोशिश कर चुका था .bind()लेकिन पहले परम के रूप में शून्य के बिना। जो काम नहीं किया।

— लारोफाइड

कोई जरूरत नहीं है null, यह .bind(event, arg1)कम से कम VueJS के साथ काम करता है ।

— DevonDahon

Answer 5

काफी पुराना और पुराना सवाल लेकिन आज भी मेरे पास यही मुद्दा था। सबसे साफ समाधान मुझे लगता है कि करी की अवधारणा का उपयोग करना है ।

उस के लिए कोड:

someObj.addEventListener('click', some_function(someVar));

var some_function = function(someVar) {
    return function curried_func(e) {
        // do something here
    }
}

करी फ़ंक्शन को नाम देकर यह आपको बाद में निष्पादन समय पर EventListener को अनलिस्टर करने के लिए Object.removeEventListener को कॉल करने की अनुमति देता है।

Comments

खुशी है कि इस जवाब का उल्लेख करी समारोह में किया गया। हालांकि आप इवेंट श्रोता को कैसे हटाएंगे?

— बॉब

अच्छी शब्दावली देखने के लिए बहुत बढ़िया। आपको कर्डी फ़ंक्शन को नाम देकर ईवेंट श्रोता को निकालने में सक्षम होना चाहिए। मैं एक संपादन का प्रस्ताव देंगे।

— मैथ्यू ब्रेंट

यह उत्तर फ़ंक्शन को कई बार पंजीकृत करेगा क्योंकि addEventListener को कहा जाता है, क्योंकि some_function (var) हर बार एक नए बनाए गए फ़ंक्शन को वापस कर रहा है।

— याहिया

मैं श्रोता cuz को हटाने के लिए कर्डी फ़ंक्शन का नाम रखने के विचार को पसंद नहीं करता हूं, फिर 2 अलग नामस्थानों के साथ काम कर रहा

— हूं

Answer 6

आप फ़ंक्शन को चर के रूप में घोषित करके तर्कों के साथ ईवेंटलिस्टर्स जोड़ और हटा सकते हैं।

myaudio.addEventListener('ended',funcName=function(){newSrc(myaudio)},false);

newSrcपैरामीटर के रूप में myaudio के साथ विधि funcNameफ़ंक्शन नाम चर है

आप श्रोता को हटा सकते हैं myaudio.removeEventListener('ended',func,false);

Answer 7

आप किसी जावास्क्रिप्ट को बंद कर सकते हैं, जिसे संदर्भ द्वारा (संदर्भ द्वारा नहीं) सुविधा के रूप में बंद किया जा सकता है :

var someVar='origin';
func = function(v){
    console.log(v);
}
document.addEventListener('click',function(someVar){
   return function(){func(someVar)}
}(someVar));
someVar='changed'

या आप एक सामान्य रैप फ़ंक्शन लिख सकते हैं जैसे wrapEventCallback:

function wrapEventCallback(callback){
    var args = Array.prototype.slice.call(arguments, 1);
    return function(e){
        callback.apply(this, args)
    }
}
var someVar='origin';
func = function(v){
    console.log(v);
}
document.addEventListener('click',wrapEventCallback(func,someVar))
someVar='changed'

यहाँ wrapEventCallback(func,var1,var2)इस तरह है:

func.bind(null, var1,var2)

Comments

इस उत्तर के लिए बहुत बहुत धन्यवाद! ओपी को इसकी तलाश नहीं थी, लेकिन मुझे लगता है कि जो लोग Google में "add to pass arventListener" टाइप करते हैं, वे आपके उत्तर की तलाश करेंगे। यह बस थोड़ा और स्पष्टीकरण की आवश्यकता है :) मैं इसे संपादित कर रहा हूं।

— सिंदूर

Answer 8

someVarमूल्य केवल some_function()संदर्भ में सुलभ होना चाहिए , श्रोता से नहीं। यदि आप इसे श्रोता के भीतर रखना पसंद करते हैं, तो आपको कुछ ऐसा करना होगा:

someObj.addEventListener("click",
                         function(){
                             var newVar = someVar;
                             some_function(someVar);
                         },
                         false);

और newVarइसके बजाय का उपयोग करें ।

दूसरा तरीका श्रोता में इसका उपयोग करने के लिए someVarमूल्य वापस करना some_function()है (एक नए स्थानीय संस्करण के रूप में):

var someVar = some_function(someVar);

Answer 9

यहाँ एक और तरीका है (यह एक छोरों के लिए काम करता है):

var someVar = some_other_function();
someObj.addEventListener("click", 

function(theVar){
    return function(){some_function(theVar)};
}(someVar),

false);

Comments

यह सबसे अच्छा तरीका है। बदसूरत, लेकिन अनाम फ़ंक्शन में एक तर्क भेजने के बाद से छोरों के भीतर प्रभावी, var को कैप्चर करेगा।

— बॉब

Answer 10

Function.prototype.bind () लक्ष्य फ़ंक्शन को किसी विशेष दायरे में बाँधने का तरीका है और वैकल्पिक रूप thisसे लक्ष्य फ़ंक्शन के भीतर ऑब्जेक्ट को परिभाषित करता है।

someObj.addEventListener("click", some_function.bind(this), false);

या कुछ शाब्दिक दायरे पर कब्जा करने के लिए, उदाहरण के लिए एक लूप में:

someObj.addEventListener("click", some_function.bind(this, arg1, arg2), false);

अंत में, यदि thisलक्ष्य फ़ंक्शन के भीतर पैरामीटर की आवश्यकता नहीं है:

someObj.addEventListener("click", some_function.bind(null, arg1, arg2), false);

Answer 11

उपयोग

   el.addEventListener('click',
    function(){
        // this will give you the id value 
        alert(this.id);    
    },
false);

और अगर आप इस अनाम फ़ंक्शन में कोई कस्टम मान पास करना चाहते हैं तो इसे करने का सबसे आसान तरीका है

 // this will dynamically create property a property
 // you can create anything like el.<your  variable>
 el.myvalue = "hello world";
 el.addEventListener('click',
    function(){
        //this will show you the myvalue 
        alert(el.myvalue);
        // this will give you the id value 
        alert(this.id);    
    },
false);

मेरे प्रोजेक्ट में पूरी तरह से काम करता है। आशा है कि यह मदद करेगा

Comments

हां, निश्चित रूप से मदद मिली, क्योंकि इसने forलूप के भीतर अपेक्षित गुंजाइश बनाए रखी ।

— j4v1

Answer 12

    $form.addEventListener('submit', save.bind(null, data, keyword, $name.value, myStemComment));
    function save(data, keyword, name, comment, event) {

इस तरह मैंने इवेंट को ठीक से पास किया।

Comments

बहुत बढ़िया, यह है कि मैं लगभग कैसे निष्कर्ष निकाल रहा था - बस गलत तरीके से अतिरिक्त घटना को बाँध में जब यह नहीं होता है (जैसे कोणीय), जो स्वचालित रूप से इस मामले में आता है।

— मनोहर रेड्डी पोरेड्डी

Answer 13

एक इवेंटलिस्ट के कॉलबैक फ़ंक्शन में तर्क भेजना एक अलग फ़ंक्शन बनाने और उस पृथक फ़ंक्शन को तर्क देने के लिए आवश्यक है।

यहाँ एक अच्छा सा हेल्पर फंक्शन है जिसका आप उपयोग कर सकते हैं। उपरोक्त "हैलो वर्ल्ड" के उदाहरण के आधार पर।

एक चीज जो भी आवश्यक है, वह फ़ंक्शन के संदर्भ को बनाए रखना है ताकि हम श्रोता को सफाई से हटा सकें।

// Lambda closure chaos.
//
// Send an anonymous function to the listener, but execute it immediately.
// This will cause the arguments are captured, which is useful when running 
// within loops.
//
// The anonymous function returns a closure, that will be executed when 
// the event triggers. And since the arguments were captured, any vars 
// that were sent in will be unique to the function.

function addListenerWithArgs(elem, evt, func, vars){
    var f = function(ff, vv){
            return (function (){
                ff(vv);
            });
    }(func, vars);

    elem.addEventListener(evt, f);

    return f;
}

// Usage:

function doSomething(withThis){
    console.log("withThis", withThis);
}

// Capture the function so we can remove it later.
var storeFunc = addListenerWithArgs(someElem, "click", doSomething, "foo");

// To remove the listener, use the normal routine:
someElem.removeEventListener("click", storeFunc);

Comments

यह उत्तर '15 से है, लेकिन यह वास्तव में है कि मुझे इस मुद्दे को उपयोग करने के लिए हुक का उपयोग करने की आवश्यकता थी। यदि आप एक रेफरी हुक का उपयोग कर रहे हैं और इसके लिए एक श्रोता की जरूरत है कि आप घटक अनमाउंटिंग पर सफाई कर सकते हैं, तो यह है। 4 वें अर्ग storeFuncआपके रेफरी चर होना चाहिए। अपने श्रोता को इस तरह से उपयोग में लाएं और आपको जाने के लिए अच्छा हो:useEffect(() => { return () => { window.removeEventListener('scroll', storeFunc, false); } }, [storeFunc])

— रोब बी

Answer 14

एक तरह से यह एक बाहरी कार्य कर रहा है :

elem.addEventListener('click', (function(numCopy) {
  return function() {
    alert(numCopy)
  };
})(num));

कोष्ठक में एक अनाम फ़ंक्शन को लपेटने और इसे तुरंत कॉल करने की इस विधि को IIFE (तत्काल-इनवॉइस किए गए अभिव्यक्ति अभिव्यक्ति) कहा जाता है

आप http://codepen.io/froucher/pen/BoWwgz में दो मापदंडों के साथ एक उदाहरण देख सकते हैं ।

catimg.addEventListener('click', (function(c, i){
  return function() {
    c.meows++;
    i.textContent = c.name + '\'s meows are: ' + c.meows;
  }
})(cat, catmeows));

Answer 15

यदि मैं फ़ंक्शन को कॉल करने का उपयोग करने से गलत नहीं हूं, तो bindवास्तव में एक नया फ़ंक्शन बनाता है जो bindविधि द्वारा वापस किया जाता है। इससे आपको बाद में समस्या होगी या यदि आप ईवेंट श्रोता को हटाना चाहेंगे, क्योंकि यह मूल रूप से एक अनाम फ़ंक्शन की तरह है:

// Possible:
function myCallback() { /* code here */ }
someObject.addEventListener('event', myCallback);
someObject.removeEventListener('event', myCallback);

// Not Possible:
function myCallback() { /* code here */ }
someObject.addEventListener('event', function() { myCallback });
someObject.removeEventListener('event', /* can't remove anonymous function */);

इसलिए इसे ध्यान में रखें।

यदि आप ES6 का उपयोग कर रहे हैं, तो आप सुझाए गए लेकिन थोड़ा क्लीनर के रूप में कर सकते हैं:

someObject.addEventListener('event', () => myCallback(params));

Answer 16

अच्छा एक लाइन विकल्प

element.addEventListener('dragstart',(evt) => onDragStart(param1, param2, param3, evt));

function onDragStart(param1, param2, param3, evt) {

 //some action...

}

Answer 17

ये भी आज़माएं (IE8 + Chrome। मुझे FF के लिए नहीं पता):

function addEvent(obj, type, fn) {
    eval('obj.on'+type+'=fn');
}

function removeEvent(obj, type) {
    eval('obj.on'+type+'=null');
}

// Use :

function someFunction (someArg) {alert(someArg);}

var object=document.getElementById('somObject_id') ;
var someArg="Hi there !";
var func=function(){someFunction (someArg)};

// mouseover is inactive
addEvent (object, 'mouseover', func);
// mouseover is now active
addEvent (object, 'mouseover');
// mouseover is inactive

आशा है कि कोई टाइपोस नहीं है :-)

Comments

पूरा उत्तर देना कितना कठिन होगा? क्या मुझे एफएफ पर यह परीक्षण करना चाहिए? खैर, मैं परेशान नहीं हूँ ...

— स्टीफन नाच

Answer 18

मैं इसमें फंस गया था क्योंकि मैं तत्वों को खोजने और इसके लिए श्रोता को जोड़ने के लिए एक लूप में इसका उपयोग कर रहा था। यदि आप इसे लूप में उपयोग कर रहे हैं, तो यह पूरी तरह से काम करेगा

for (var i = 0; i < states_array.length; i++) {
     var link = document.getElementById('apply_'+states_array[i].state_id);
     link.my_id = i;
     link.addEventListener('click', function(e) {   
        alert(e.target.my_id);        
        some_function(states_array[e.target.my_id].css_url);
     });
}

Answer 19

2019 में, कई एपीआई परिवर्तन, सबसे अच्छा जवाब अब काम नहीं करता है, बग को ठीक किए बिना।

कुछ काम कोड साझा करें।

उपरोक्त सभी उत्तर से प्रेरित।

 button_element = document.getElementById('your-button')

 button_element.setAttribute('your-parameter-name',your-parameter-value);

 button_element.addEventListener('click', your_function);


 function your_function(event)
   {
      //when click print the parameter value 
      console.log(event.currentTarget.attributes.your-parameter-name.value;)
   }

Answer 20

सभी कार्यों के अंदर एक विशेष चर है: तर्क । आप अपने मापदंडों को अनाम पैरामीटर के रूप में पास कर सकते हैं और तर्कों के चर के माध्यम से उन्हें (आदेश द्वारा) एक्सेस कर सकते हैं ।

उदाहरण:

var someVar = some_other_function();
someObj.addEventListener("click", function(someVar){
    some_function(arguments[0]);
}, false);

Comments

हम्म ... क्या कारण है डाउनवोट? यदि यह वह नहीं था जिसे आप ढूंढ रहे हैं, तो कृपया स्पष्ट रूप से समझाएं कि आपका क्या मतलब है (मुझे पता है कि प्रश्न का उत्तर पहले ही दिया गया है)। लेकिन क्या आपने जो मांगा है, उसका जवाब देना मेरा कोड नहीं है? विशेष चर "तर्क" आपको एक फ़ंक्शन के अंदर सभी मापदंडों तक पहुंच प्रदान करता है।

— स्टेनी

Answer 21

    var EV = {
        ev: '',
        fn: '',
        elem: '',
        add: function () {
            this.elem.addEventListener(this.ev, this.fn, false);
        }
    };

    function cons() {
        console.log('some what');
    }

    EV.ev = 'click';
    EV.fn = cons;
    EV.elem = document.getElementById('body');
    EV.add();

//If you want to add one more listener for load event then simply add this two lines of code:

    EV.ev = 'load';
    EV.add();

Answer 22

निम्नलिखित दृष्टिकोण ने मेरे लिए अच्छा काम किया। से संशोधित यहाँ ।

function callback(theVar) {
  return function() {
    theVar();
  }
}

function some_other_function() {
  document.body.innerHTML += "made it.";
}

var someVar = some_other_function;
document.getElementById('button').addEventListener('click', callback(someVar));

<!DOCTYPE html>
<html>
  <body>
    <button type="button" id="button">Click Me!</button>
  </body>
</html>

Answer 23

निम्नलिखित उत्तर सही है, लेकिन नीचे का कोड IE8 में काम नहीं कर रहा है यदि आपको लगता है कि आप यूकोमप्रेसर का उपयोग करके जेएस फाइल को संपीड़ित करते हैं। (वास्तव में, अभी भी IE8 का उपयोग करने वाले अधिकांश अमेरिकी लोग हैं)

var someVar; 
someVar = some_other_function();
alert(someVar);
someObj.addEventListener("click",
                         function(){
                          some_function(someVar);
                         },
                         false);

इसलिए, हम उपरोक्त मुद्दे को निम्नानुसार ठीक कर सकते हैं और यह सभी ब्राउज़रों में ठीक काम करता है

var someVar, eventListnerFunc;
someVar = some_other_function();
eventListnerFunc = some_function(someVar);
someObj.addEventListener("click", eventListnerFunc, false);

आशा है, यह कुछ के लिए उपयोगी होगा जो उत्पादन वातावरण में js फ़ाइल को संपीड़ित कर रहा है।

शुभ लाभ!!

Answer 24

निम्नलिखित कोड ने मेरे लिए ठीक काम किया (फ़ायरफ़ॉक्स):

for (var i=0; i<3; i++) {
   element = new ...   // create your element
   element.counter = i;
   element.addEventListener('click', function(e){
        console.log(this.counter);
        ...            // another code with this element
   }, false);
}

आउटपुट:

0
1
2

Comments

दुनिया में यह क्या है?

— नीलक न्यूमैन

Answer 25

आप की जरूरत है:

newElem.addEventListener('click', {
    handleEvent: function (event) {
        clickImg(parameter);
    }
});

Answer 26

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

उदाहरण मैंने फ़ाइल रीडिंग के साथ काम किया, क्योंकि मुझे छवि और फ़ाइल नाम के पूर्वावलोकन को पकड़ने और प्रस्तुत करने की आवश्यकता थी। कई फ़ाइल अपलोड प्रकार का उपयोग करते समय मुझे अतुल्यकालिक मुद्दों से बचने में थोड़ी देर लगी। मैं गलती से विभिन्न फ़ाइलों को अपलोड करने के बावजूद सभी रेंडरर्स पर एक ही 'नाम' देखूंगा।

मूल रूप से, सभी रीडफ़ाइल () फ़ंक्शन रीड फ़ाइल्स () फ़ंक्शन के भीतर था। इससे एसिंक्रोनस स्कूपिंग समस्याएँ हुईं।

    function readFiles(input) {
      if (input.files) {
        for(i=0;i<input.files.length;i++) {

          var filename = input.files[i].name;

          if ( /\.(jpe?g|jpg|png|gif|svg|bmp)$/i.test(filename) ) {
            readFile(input.files[i],filename);
          }
       }
      }
    } //end readFiles



    function readFile(file,filename) {
            var reader = new FileReader();

            reader.addEventListener("load", function() { alert(filename);}, false);

            reader.readAsDataURL(file);

    } //end readFile

Answer 27

बस जोड़ना चाहेंगे। यदि कोई ऐसा फ़ंक्शन जोड़ रहा है जो किसी ईवेंट श्रोता को चेकबॉक्स अपडेट करता है, तो आपको चेकबॉक्स को अपडेट करने के event.targetबजाय उपयोग करना होगा this।

Answer 28

मेरा बहुत सरल दृष्टिकोण है। यह दूसरों के लिए काम आ सकता है क्योंकि इससे मुझे मदद मिली। यह है ... जब आप कई तत्वों / चर एक ही कार्य सौंपा है और आप संदर्भ पारित करना चाहते हैं, सबसे सरल समाधान है ...

function Name()
{

this.methodName = "Value"

}

बस। इसने मेरे लिए काम किया। बहुत आसन।

Answer 29

अन्य विकल्प, शायद बाँध के उपयोग के रूप में सुरुचिपूर्ण नहीं है, लेकिन यह लूप में घटनाओं के लिए मान्य है

for (var key in catalog){
    document.getElementById(key).my_id = key
    document.getElementById(key).addEventListener('click', function(e) {
        editorContent.loadCatalogEntry(e.srcElement.my_id)
    }, false);
}

यह Google क्रोम एक्सटेंशन के लिए परीक्षण किया गया है और शायद e.srcElement को अन्य ब्राउज़रों में e.source द्वारा प्रतिस्थापित किया जाना चाहिए

मुझे यह समाधान Imatoria द्वारा पोस्ट की गई टिप्पणी का उपयोग करके मिला, लेकिन मैं इसे उतना उपयोगी नहीं मान सकता क्योंकि मेरे पास पर्याप्त प्रतिष्ठा नहीं है: D

Answer 30

यह घोल दिखने में अच्छा हो सकता है

var some_other_function = someVar => function() {
}

someObj.addEventListener('click', some_other_function(someVar));

या बाँध वाल्व भी अच्छे होंगे