जावास्क्रिप्ट / jQuery में क्या (ई) का मतलब है?


94

मैं जावास्क्रिप्ट / jQuery के लिए नया हूं और मैं सीख रहा हूं कि कैसे कार्य करना है। ब्रैकेट्स में बहुत सारे फ़ंक्शंस क्रॉप किए गए हैं। मे तुम्हें दिखाता हूँ की मेरा क्या मतलब हैं:

$(this).click(function(e) {
    // does something
});

यह हमेशा प्रतीत होता है कि फ़ंक्शन (ई) के मूल्य का भी उपयोग नहीं करता है, इसलिए ऐसा अक्सर क्यों होता है?

जवाबों:


102

eeventऑब्जेक्ट के लिए लघु var संदर्भ है जिसे इवेंट हैंडलर को पास किया जाएगा।

इवेंट ऑब्जेक्ट में अनिवार्य रूप से बहुत सारे दिलचस्प तरीके और गुण होते हैं जिनका उपयोग इवेंट हैंडलर में किया जा सकता है।

आपके द्वारा पोस्ट किए गए उदाहरण में एक क्लिक हैंडलर है जो एक है MouseEvent

$(<element selector>).click(function(e) {
    // does something
    alert(e.type); //will return you click
}

DEMO - माउस इवेंट DEMO उपयोग करता हैe.whichऔरe.type

कुछ उपयोगी संदर्भ:

http://api.jquery.com/category/events/

http://www.quirksmode.org/js/events_properties.html

http://www.javascriptkit.com/jsref/event.shtml

http://www.quirksmode.org/dom/events/index.html

http://www.w3.org/TR/DOM-Level-3-Events/#event-types-list


योग्य, यह लगभग एक मूर्खतापूर्ण प्रश्न की तरह लगता है, लेकिन कभी भी कम नहीं होता है, यह सही जगह पर है। आप नियमित रूप से js की तुलना में इसके उपयोग के उदाहरण के साथ उत्तर देना चाह सकते हैं (ऐसा नहीं है कि कोई भिन्नता है, लेकिन यह कैसे है jQuery की समानता में jQuery में प्रयुक्त)
SpYk3HH

@ SpYk3HH सहमत। ऐसा करने की योजना बना रहा है।
सेल्वकुमार अरुमुगम

@SelvakumarArumugam तो मुझे यकीन नहीं है कि वे एक ही बात कर रहे हैं। ऐसा लगता है कि एक रिटर्न w.Event और दूसरा रिटर्न MouseEvent। ऊपर के उदाहरण के लिए मुझे लगता है कि वे समान हैं, लेकिन $ (दस्तावेज़) के मामले में .on ('क्लिक', '.btn', e => {कंसोल.लॉग (e); कंसोल.लॉग (ईवेंट)}; ); दो अलग हैं। विशेष रूप से e.currentTarget और event.currentTarget के लिए। इस स्थिति में e.currentTarget आपको वह देगा जो आपको चाहिए, लेकिन Event.currentTarget दस्तावेज़ लौटाता है न कि आप जिस बटन पर क्लिक करते हैं।
एडम छोटी

प्रतिक्रियाओं को देखते हुए मैं कहूंगा कि घटना === e.originalEvent, और उस ई में थोड़ा और विस्तार है।
एडम छोटी


46

अस्वीकरण: यह इस विशेष पोस्ट के लिए एक बहुत देर से प्रतिक्रिया है लेकिन जैसा कि मैंने इस प्रश्न के विभिन्न प्रतिक्रियाओं के माध्यम से पढ़ा है, इसने मुझे मारा कि अधिकांश उत्तर शब्दावली का उपयोग करते हैं जो केवल अनुभवी कोडर द्वारा समझा जा सकता है। यह उत्तर मूल प्रश्न को नौसिखिए दर्शकों को ध्यान में रखते हुए संबोधित करने का प्रयास है।

पहचान

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

निम्नलिखित jQuery के उदाहरणों पर विचार करें:

$("#someLink").on("click", function(e){ // My preferred method
    e.preventDefault();
});

$("#someLink").click(function(e){ // Some use this method too
    e.preventDefault();
});

व्याख्या

  • "#someLink" आपका तत्व चयनकर्ता है (जो HTML टैग इसे ट्रिगर करेगा)।
  • "क्लिक" एक घटना है (जब चयनित तत्व पर क्लिक किया जाता है)।
  • "function (e)" ईवेंट हैंडलिंग फंक्शन है (ईवेंट पर, ऑब्जेक्ट बनाया जाता है)।
  • "ई" ऑब्जेक्ट हैंडलर है (ऑब्जेक्ट को सुलभ बनाया गया है)।
  • "preventDefault ()" ऑब्जेक्ट द्वारा प्रदान की गई एक विधि (फ़ंक्शन) है।

क्या हो रहा है?
जब कोई उपयोगकर्ता आईडी "#someLink" (शायद एक एंकर टैग) केसाथ तत्व पर क्लिक करता है, तो एक अनाम फ़ंक्शन, "फ़ंक्शन (ई)" को कॉल करें, और परिणामस्वरूप ऑब्जेक्ट को एक हैंडलर "ई" पर असाइन करें। अब उस हैंडलर को ले लो और इसके एक तरीके को कॉल करें, "e.preventDefault ()" , जो ब्राउज़र को उस तत्व के लिए डिफ़ॉल्ट कार्रवाई करने से रोकना चाहिए।

नोट: संभाल बहुत कुछ आप चाहते हैं नाम दिया जा सकता है (यानी ' फ़ंक्शन (billybob) ')। 'ई' का अर्थ 'ईवेंट' है, जो इस प्रकार के फंक्शन के लिए काफी मानक है।

हालांकि 'e.preventDefault ()' शायद इवेंट हैंडलर का सबसे आम उपयोग है, ऑब्जेक्ट में ही कई गुण और विधियाँ शामिल हैं जिन्हें इवेंट हैंडलर के माध्यम से एक्सेस किया जा सकता है।

इस विषय पर कुछ अच्छी जानकारी jQuery के शिक्षण स्थल, http://learn.jquery.com पर देखी जा सकती है । JQuery कोर और ईवेंट अनुभागों का उपयोग करने पर विशेष ध्यान दें ।


29

eकोई विशेष अर्थ नहीं है। eजब पैरामीटर होता है तो यह फंक्शन पैरामीटर नाम के रूप में उपयोग करने के लिए एक सम्मेलन है event

यह हो सकता है

$(this).click(function(loremipsumdolorsitamet) {
    // does something
}

भी।


8

उस उदाहरण में, eकेवल उस फ़ंक्शन के लिए एक पैरामीटर है, लेकिन यह eventऑब्जेक्ट है जो इसके माध्यम से गुजरता है।


7

eतर्क घटना वस्तु के लिए कम है। उदाहरण के लिए, आप उन एंकरों के लिए कोड बनाना चाह सकते हैं जो डिफ़ॉल्ट क्रिया को रद्द कर देते हैं। ऐसा करने के लिए आप कुछ इस तरह लिखेंगे:

$('a').click(function(e) {
    e.preventDefault();
}

इसका मतलब है कि जब कोई <a>टैग क्लिक किया जाता है, तो क्लिक इवेंट की डिफ़ॉल्ट कार्रवाई को रोकें।

हालांकि आप इसे अक्सर देख सकते हैं, यह कुछ ऐसा नहीं है जिसे आपको फ़ंक्शन के भीतर उपयोग करना है, भले ही आपने इसे तर्क के रूप में निर्दिष्ट किया हो।


4

JQuery के लिए eसंक्षेप में event, वर्तमान घटना वस्तु। यह आमतौर पर ईवेंट फ़ंक्शन को निकाल दिए जाने के लिए एक पैरामीटर के रूप में पारित किया जाता है।

डेमो: jQuery ईवेंट

डेमो में मैंने इस्तेमाल किया e

$("img").on("click dblclick mouseover mouseout",function(e){
        $("h1").html("Event: " + e.type);
}); 

मैं भी इस्तेमाल किया जा सकता है event

 $("img").on("click dblclick mouseover mouseout",function(event){
            $("h1").html("Event: " + event.type);
    }); 

वही चीज!

प्रोग्रामर आलसी हैं हम बहुत से शॉर्टहैंड का उपयोग करते हैं, आंशिक रूप से यह हमारे काम को कम करता है, आंशिक रूप से पठनीयता के साथ मदद करता है। यह समझना कि आपको कोड लिखने की मानसिकता को समझने में मदद मिलेगी।


4

आज मैंने सिर्फ एक पोस्ट लिखा है कि "हम ई.पर्वटरडेफ़ल ()" में "ई" जैसे अक्षरों का उपयोग क्यों करते हैं? और मुझे लगता है कि मेरा जवाब कुछ समझ में आएगा ...

सबसे पहले, हमें addEventListener का सिंटैक्स देखें

आम तौर पर यह होगा: target.addEventListener (प्रकार, श्रोता [, useCapture]);

और addEventlistener के मापदंडों की परिभाषा हैं:

टाइप type एक स्ट्रिंग जो ईवेंट प्रकार का प्रतिनिधित्व करती है, जिसके लिए सुनने के लिए।

श्रोता ener वह वस्तु जो एक अधिसूचना प्राप्त करती है (एक वस्तु जो इवेंट इंटरफ़ेस को लागू करती है) जब निर्दिष्ट प्रकार की कोई घटना होती है। यह EventListener इंटरफ़ेस या जावास्क्रिप्ट फ़ंक्शन को लागू करने वाली एक वस्तु होनी चाहिए।

(एनएन से)

लेकिन मुझे लगता है कि एक बात पर टिप्पणी की जानी चाहिए: जब आप जावास्क्रिप्ट फ़ंक्शन को श्रोता के रूप में उपयोग करते हैं, तो ऑब्जेक्ट जो कि इवेंट इंटरफ़ेस (ऑब्जेक्ट इवेंट) को लागू करता है, स्वचालित रूप से फ़ंक्शन के "पहले पैरामीटर" को सौंपा जाएगा । यदि आप उपयोग करते हैं, तो फ़ंक्शन (ई), ऑब्जेक्ट को "ई" को सौंपा जाएगा क्योंकि "ई" फ़ंक्शन का एकमात्र पैरामीटर है (निश्चित रूप से पहले वाला!), तो आप कुछ को रोकने के लिए e.preventDefault का उपयोग कर सकते हैं ...।

आइए नीचे दिए गए उदाहरण की कोशिश करें:

<p>Please click on the checkbox control.</p>
<form>
    <label for="id-checkbox">Checkbox</label>
    <input type="checkbox" id="id-checkbox"/>

    </div>
</form>
<script>
    document.querySelector("#id-checkbox").addEventListener("click", function(e,v){
         //var e=3;
         var v=5;
         var t=e+v;
         console.log(t);
        e.preventDefault();

    }, false);
</script>

परिणाम होगा: [ऑब्जेक्ट माउसइवेंट] 5 और आप क्लिक इवेंट को रोकेंगे।

लेकिन अगर आप टिप्पणी चिन्ह को हटाते हैं जैसे:

<script>
       document.querySelector("#id-checkbox").addEventListener("click", function(e,v){
            var e=3;
            var v=5;
            var t=e+v;
            console.log(t);
            e.preventDefault();

       }, false);
   </script>

आपको यह मिलेगा: 8 और एक त्रुटि : "बिना पढ़ा हुआ टाइपर: e.preventDefault HTMLInputElement। (VM409: 69)" पर एक फ़ंक्शन नहीं है।

निश्चित रूप से, इस बार क्लिक ईवेंट को रोका नहीं जाएगा। लेकिन मान लीजिए कि फ़ंक्शन में "ई" को फिर से परिभाषित किया गया था।

हालाँकि, यदि आप कोड को इसमें बदलते हैं:

<script>
       document.querySelector("#id-checkbox").addEventListener("click", function(e,v){
            var e=3;
            var v=5;
            var t=e+v;
            console.log(t);
            event.preventDefault();

       }, false);
   </script>

हर काम फिर से ठीक से काम करेगा ... आपको 8 मिलेंगे और क्लिक इवेंट को रोका जाएगा ...

इसलिए, "ई" आपके फ़ंक्शन का एक पैरामीटर है और आपको "ईवेंट ऑब्जेक्ट" प्राप्त करने के लिए फ़ंक्शन () में "ई" की आवश्यकता होती है, फिर ई.पेंटवेंटफॉल्ट () का प्रदर्शन करें। यही कारण है कि आप "ई" को ऐसे किसी भी शब्द में बदल सकते हैं जो js द्वारा आरक्षित नहीं है।


2

यह वर्तमान ईवेंट ऑब्जेक्ट का संदर्भ है


-1
$(this).click(function(e) {
    // does something
});

उपरोक्त कोड के संदर्भ
$(this)में वह तत्व है जो कुछ चर के रूप में है।
clickवह घटना है जिसे करने की आवश्यकता है।
पैरामीटर eको स्वचालित रूप से js से आपके फ़ंक्शन में पास किया जाता है जो मूल्य का $(this)मान रखता है और कुछ ऑपरेशन करने के लिए आपके कोड में आगे उपयोग किया जा सकता है।


ई एक क्लिक हैंडलर में क्लिक किए गए तत्व की जावास्क्रिप्ट घटना और $ का मूल्य नहीं है (यह)।
गेरबेन जोंगेरियस 12
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.