एक क्लिक ईवेंट श्रोता के लिए 'वापसी झूठी' जोड़ने का क्या प्रभाव है?


359

कई बार मैंने एचटीएमएल पेजों में इस तरह के लिंक देखे हैं:

<a href='#' onclick='someFunc(3.1415926); return false;'>Click here !</a>

return falseवहां का प्रभाव क्या है ?

इसके अलावा, मैं आमतौर पर बटन में नहीं देखता हूं।

क्या यह कहीं भी निर्दिष्ट है? कुछ कल्पना में w3.org?


5
और लियोनेल के उदाहरण में व्यावहारिक समस्या यह है कि यदि वर्तमान पृष्ठ को किसी तरह से नीचे स्क्रॉल किया जाता है, तो यह वापसी के बिना शीर्ष पर कूद जाएगा;
बजे

मेरी इंटेलीज ने शिकायत की "झूठे?" "बाहरी फ़ंक्शन परिभाषा" संदेश के साथ
ses

जवाबों:


310

किसी ईवेंट हैंडलर का रिटर्न मान निर्धारित करता है कि डिफ़ॉल्ट ब्राउज़र व्यवहार को भी होना चाहिए या नहीं। लिंक पर क्लिक करने के मामले में, यह लिंक का अनुसरण कर रहा होगा, लेकिन फ़र्क सबमिट हैंडलर में अंतर सबसे अधिक ध्यान देने योग्य होता है, जहाँ उपयोगकर्ता द्वारा जानकारी दर्ज करने में गलती होने पर आप फॉर्म सबमिट को रद्द कर सकते हैं।

मैं नहीं मानता कि इसके लिए W3C विनिर्देश है। इस तरह के सभी प्राचीन जावास्क्रिप्ट इंटरफेस को "DOM 0" उपनाम दिया गया है, और ज्यादातर अनिर्दिष्ट हैं। आपके पास पुराना नेटस्केप 2 प्रलेखन पढ़ने के लिए कुछ किस्मत हो सकती है।

इस प्रभाव को प्राप्त करने का आधुनिक तरीका कॉल करना है event.preventDefault(), और यह DOM 2 ईवेंट स्पेसिफिकेशन में निर्दिष्ट है


41
event.preventDefault ? event.preventDefault() : event.returnValue = false;IE में भी काम करेगा

3
Chrome को छोड़कर प्रत्येक ब्राउज़र ने return falseविधि के साथ काम किया , लेकिन मुझे event.preventDefaultChrome की आवश्यकता थी ।
बजे ०१

3
Chrome return falseअब विधि के साथ काम करता है । यह एक img तत्व की ऑनक्लिक घटना में लिंक का अनुसरण करना बंद कर देता है।
बाओ

सादे जेएस फॉर्म में हैंडलर को वापस लौटाएं, यह गलत नहीं है (कम से कम क्रोम में) इसलिए मैं e.preventDefault () का उपयोग करता हूं। e.preventDefault के ऊपर @ 2astalavista की टिप्पणी के अनुसार IE में विफल रहता है इसलिए उसकी विधि का उपयोग करें: event.preventDefault? event.preventDefault (): event.returnValue = false;
luigi7up

162

आप निम्न उदाहरण के साथ अंतर देख सकते हैं:

<a href="http://www.google.co.uk/" onclick="return (confirm('Follow this link?'))">Google</a>

"ओके" पर क्लिक करना सही है, और लिंक का पालन किया जाता है। "रद्द करें" पर क्लिक करने से झूठी वापसी होती है और लिंक का पालन नहीं होता है। यदि जावास्क्रिप्ट को अक्षम किया जाता है तो लिंक का पालन सामान्य रूप से किया जाता है।


7
वास्तव में मैं क्या देख रहा था, सबमिट बटन पर भी सही काम करता है! <button type="submit" onclick="return confirm('Do you really want to delete this?');">Delete</button>
ArendE

27

यहां सभी ब्राउज़रों में डिफ़ॉल्ट व्यवहार और ईवेंट बबलिंग को रद्द करने के लिए अधिक मजबूत दिनचर्या है:

// Prevents event bubble up or any usage after this is called.
eventCancel = function (e)
{
    if (!e)
        if (window.event) e = window.event;
    else return;
    if (e.cancelBubble != null) e.cancelBubble = true;
    if (e.stopPropagation) e.stopPropagation();
    if (e.preventDefault) e.preventDefault();
    if (window.event) e.returnValue = false;
    if (e.cancel != null) e.cancel = true;
}

ईवेंट हैंडलर में इसका उपयोग कैसे किया जाएगा, इसका एक उदाहरण:

// Handles the click event for each tab
Tabstrip.tabstripLinkElement_click = function (evt, context) 
{
    // Find the tabStrip element (we know it's the parent element of this link)
    var tabstripElement = this.parentNode;
    Tabstrip.showTabByLink(tabstripElement, this);
    return eventCancel(evt);
}

एक शिम अच्छा है, लेकिन व्यावहारिक लाभ क्या है return false;? kamesh का उत्तर इससे थोड़ा संबंधित है, लेकिन चूंकि एक मौका है कि आपका shim एक या दूसरे को करता है, तो वे अलग-अलग परिणाम कैसे tabstripLinkElement_clickब्राउज़र से ब्राउज़र में परिवर्तन ऑपरेशन करने जा रहे हैं ? यदि कोई परिचालन अंतर नहीं है, तो (व्यवहार में) क्यों परेशान है (भले ही, सिद्धांत रूप में, यह द राइट थिंग है)? धन्यवाद, और ज़ोंबी उत्तर प्रश्न के लिए एआईए।
रफिन

7
पहले कोड ब्लॉक में एक अनुगामी है else। भयानक कोडिंग शैली। कुछ घुंघराले ब्रेसिज़ में जोड़ें ताकि यह अस्पष्ट न हो।
mbomb007

23

"झूठे वापस" क्या वास्तव में कर रहा है?

जब आप इसे कहते हैं, तो झूठे वास्तव में तीन बहुत अलग चीजें कर रहे हैं:

  1. event.preventDefault ();
  2. event.stopPropagation ();
  3. कॉलबैक निष्पादन रोक देता है और कॉल किए जाने पर तुरंत वापस आ जाता है।

देखें jQuery-घटनाओं-स्टॉप-दुरुपयोग-रिटर्न-झूठी अधिक जानकारी के लिए।

उदाहरण के लिए :

इस लिंक पर क्लिक करते समय, गलत लौटें ब्राउज़र का डिफ़ॉल्ट व्यवहार रद्द कर देगा ।

<a href='#' onclick='someFunc(3.1415926); return false;'>Click here !</a>

7
onclick = "रिटर्न झूठे" एक jQuery क्लिक इवेंट हैंडलर से झूठे लौटने के समान नहीं है। ब्राउज़र केवल डिफ़ॉल्ट हैंडलर को रोकते हैं (उदा e.preventDefault()) लेकिन प्रचार बंद न करें। देखें: jsfiddle.net/18yq1783
जेमी ट्रैवेरी

1
Fwiw, ब्लॉग का लिंक एटीएम टूट गया है। एक संग्रह यहाँ है
रफिन

16

एक जावास्क्रिप्ट घटना से झूठे को पुनर्प्राप्त करना आमतौर पर "डिफ़ॉल्ट" व्यवहार को रद्द कर देता है - लिंक के मामले में, यह ब्राउज़र को लिंक का पालन नहीं करने के लिए कहता है।


5
"आम तौर पर"? हमेशा तो नहीं?
मारिया इनेस परनिरी जुले

12

मेरा मानना ​​है कि यह मानक घटना नहीं होने का कारण बनता है।

आपके उदाहरण में ब्राउज़र # पर जाने का प्रयास नहीं करेगा।


12

जावास्क्रिप्ट के चलने के बाद हाइपरलिंक का अनुसरण करने से गलत तरीके से वापस आना बंद हो जाएगा। यह विनीत जावास्क्रिप्ट के लिए उपयोगी है जो इनायत से घटता है - उदाहरण के लिए, आपके पास एक थंबनेल छवि हो सकती है जो पूर्ण आकार की छवि के पॉप-अप को खोलने के लिए जावास्क्रिप्ट का उपयोग करती है। जब जावास्क्रिप्ट को बंद कर दिया जाता है या छवि मध्य-क्लिक की जाती है (एक नए टैब में खोली जाती है) तो यह ऑनक्लिक ईवेंट को अनदेखा कर देता है और छवि को सामान्य रूप से पूर्ण आकार की छवि के रूप में खोलता है।

यदि वापसी झूठी निर्दिष्ट नहीं की गई थी, तो छवि दोनों पॉप-अप लॉन्च करेगी और छवि को सामान्य रूप से खोल देगी। कुछ लोग रिटर्न असत्य जावास्क्रिप्ट का उपयोग करने के बजाय href विशेषता के रूप में करते हैं, लेकिन इसका मतलब यह है कि जब जावास्क्रिप्ट को निष्क्रिय किया जाता है तो लिंक कुछ भी नहीं करेगा।


7

ऑनक्लिक ईवेंट में गलत तरीके से रिटर्न का उपयोग करने से ब्राउज़र को बाकी निष्पादन स्टैक को संसाधित करने से रोकता है, जिसमें href विशेषता में लिंक का पालन करना शामिल है।

दूसरे शब्दों में, रिटर्न को गलत तरीके से जोड़ने से काम करना बंद हो जाता है। आपके उदाहरण में, यह वही है जो आप चाहते हैं।

बटनों में, यह आवश्यक नहीं है क्योंकि ऑनक्लिक यह सब कभी निष्पादित होगा - प्रक्रिया और जाने के लिए कोई href नहीं है।


6

वापसी झूठी डिफ़ॉल्ट कार्रवाई नहीं करने के लिए कह रही है, जो <a href>लिंक का पालन करने के लिए एक के मामले में है। जब आप ऑन्कलिक के लिए झूठे वापस आते हैं, तो href को नजरअंदाज कर दिया जाएगा।



3

झूठे वापसी नेविगेशन को रोक देगा। अन्यथा, स्थान someFunc का रिटर्न मान बन जाएगा


नहीं, स्थान href विशेषता की सामग्री बन जाएगा
क्रिस Marasti-Georg

यदि यह href = "जावास्क्रिप्ट: someFunc ()" है, तो यह घटना संचालकों के लिए नहीं है।
जिम

3

return falseरोकता से पेज नेविगेट और ऊपर या नीचे करने के लिए एक खिड़की के अवांछित स्क्रॉल जा रहा है।

onclick="return false"

3

मुझे आश्चर्य है कि onmousedownइसके बजाय किसी ने उल्लेख नहीं किया onclick

onclick='return false'

ब्राउज़र के डिफ़ॉल्ट व्यवहार को नहीं पकड़ता है जिसके परिणामस्वरूप (कभी-कभी अवांछित) पाठ चयन होता है mousedownलेकिन

onmousedown='return false'

कर देता है।

दूसरे शब्दों में, जब मैं एक बटन पर क्लिक करता हूं, तो इसका पाठ कभी-कभी गलती से बटन का रूप बदलकर चुना जाता है, जो अवांछित हो सकता है। यह डिफ़ॉल्ट व्यवहार है जिसे हम यहां रोकने की कोशिश कर रहे हैं। हालाँकि, mousedownईवेंट पहले से पंजीकृत है click, इसलिए यदि आप केवल अपने clickहैंडलर के अंदर उस व्यवहार को रोकते हैं, तो यह mousedownईवेंट से उत्पन्न अवांछित चयन को प्रभावित नहीं करेगा । तो पाठ अभी भी चुना जाता है। हालांकि, mousedownईवेंट के लिए डिफ़ॉल्ट को रोकने से काम चल जाएगा।

यह भी देखें event.preventDefault () बनाम झूठी वापसी


@FrederikKrautwald आप सही हैं, यह गुप्त था और मुझे 'चयन' नहीं 'मार्किंग' कहना चाहिए था। मैंने इसे और अधिक स्पष्ट लिखने की कोशिश की है, आशा है कि यह अधिक समझ में आता है।
दिमित्री जैतसेव

0

मेरे HTML- पृष्ठ पर यह लिंक है:

<a href = "" 
onclick = "setBodyHtml ('new content'); return false; "
> click here </a>

फ़ंक्शन setBodyHtml () के रूप में परिभाषित किया गया है:

function setBodyHtml (s)
{ document.body.innerHTML = s;
}

जब मैं लिंक पर क्लिक करता हूं तो लिंक गायब हो जाता है और ब्राउज़र में दिखाया गया टेक्स्ट "नई सामग्री" में बदल जाता है।

लेकिन अगर मैं अपने लिंक से "गलत" हटाता हूं, तो लिंक पर क्लिक करने से (प्रतीत होता है) कुछ भी नहीं है। ऐसा क्यों है?

ऐसा इसलिए है क्योंकि यदि मैं लिंक पर क्लिक करने और उसके लक्ष्य-पृष्ठ को प्रदर्शित करने के डिफ़ॉल्ट व्यवहार को गलत नहीं लौटाता, तो रद्द नहीं किया जाता है। लेकिन, यहाँ हाइपरलिंक का href "" है इसलिए यह SAME करंट पेज पर वापस लिंक करता है। तो पृष्ठ प्रभावी रूप से सिर्फ ताज़ा है और प्रतीत होता है कि कुछ भी नहीं होता है।

बैकग्राउंड में फंक्शन setBodyHtml () अभी भी निष्पादित होता है। यह body.innerHTML को अपना तर्क देता है। लेकिन क्योंकि पृष्ठ को तुरंत ताज़ा किया गया है / संशोधित बॉडी-कंटेंट शायद कुछ मिलीसेकंड से अधिक समय तक दिखाई नहीं देता है, इसलिए मैं इसे नहीं देखूंगा।

यह उदाहरण दिखाता है कि "कभी-कभी झूठे" का उपयोग करने के लिए USEFUL का उपयोग क्यों किया जाता है।

मैं लिंक को कुछ href असाइन करना चाहता हूं, ताकि यह लिंक के रूप में, रेखांकित पाठ के रूप में दिखाई दे। लेकिन मैं नहीं चाहता कि लिंक पर क्लिक करने से प्रभावी रूप से सिर्फ पृष्ठ पुनः लोड हो। मैं चाहता हूं कि डिफ़ॉल्ट नेविगेशन = व्यवहार को रद्द कर दिया जाए और जो भी दुष्प्रभाव मेरे कार्य को प्रभाव में लेने और रहने के लिए कहते हैं। इसलिए मुझे "झूठे लौटना चाहिए"।

उपरोक्त उदाहरण कुछ ऐसा है जिसे आप विकास के दौरान जल्दी से आज़माएंगे। उत्पादन के लिए आप अधिक जावास्क्रिप्ट में क्लिक-हैंडलर निर्दिष्ट करेंगे और इसके बजाय निवारण () को कॉल करेंगे। लेकिन एक त्वरित कोशिश के लिए, ऊपर "झूठे झूठ" से यह चाल चली जाती है।


0

प्रपत्रों का उपयोग करते समय using हम सबमिट करने से रोकने के लिए 'रिटर्न गलत' का उपयोग कर सकते हैं।

function checkForm() {
    // return true to submit, return false to prevent submitting
}
<form onsubmit="return checkForm()">
    ...
</form>
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.