पृष्ठ छोड़ने से पहले जावास्क्रिप्ट

233

मैं उपयोगकर्ता को पृष्ठ छोड़ने से पहले एक पुष्टि करना चाहता हूं। यदि वह ठीक कहता है तो यह नए पृष्ठ पर भेज देगा या छोड़ने के लिए रद्द कर देगा। मैंने इसे ओनलोड के साथ बनाने की कोशिश की

<script type="text/javascript">
function con() {
    var answer = confirm("do you want to check our other products")
    if (answer){

        alert("bye");
    }
    else{
        window.location = "http://www.example.com";
    }
}
</script>
</head>

<body onunload="con();">
<h1 style="text-align:center">main page</h1>
</body>
</html>

लेकिन यह पृष्ठ पहले से ही बंद होने के बाद पुष्टि करता है? इसे ठीक से कैसे करें?

यह बेहतर होगा यदि कोई यह दिखाए कि इसे jQuery के साथ कैसे किया जाए?

javascript jquery

— KD7
स्रोत

1

हा हा हा ... हाँ, यह बिल्कुल सही है..लेकिन सौभाग्य से यह मेरी साइट नहीं है ... मेरा ग्राहक इसे अपनी तरफ करने के लिए कह रहा है

— kd7

25

हां, लेकिन मैं उन अलर्ट को देखकर वास्तव में खुश हूं जब मैं एक अनचाहे जीमेल पेज को छोड़ने वाला हूं।

— 14

नोट, फ़ायरफ़ॉक्स 4+ पर केवल आपके कस्टम संदेश डेवलपर.

— mozilla.org/en-US/docs/Web/Events/beforeunload#Notes के

4

सहेजे गए परिवर्तनों के साथ वेब पेज छोड़ने से पहले वार्न उपयोगकर्ता

— वसीम ए।

352

onunload(या onbeforeunload) उपयोगकर्ता को किसी अन्य पृष्ठ पर पुनर्निर्देशित नहीं कर सकता है। यह सुरक्षा कारणों से है।

यदि आप उपयोगकर्ता को पृष्ठ छोड़ने से पहले एक संकेत दिखाना चाहते हैं, तो उपयोग करें onbeforeunload:

window.onbeforeunload = function(){
  return 'Are you sure you want to leave?';
};

या jQuery के साथ:

$(window).bind('beforeunload', function(){
  return 'Are you sure you want to leave?';
});

यह केवल उपयोगकर्ता से पूछेगा कि क्या वे पृष्ठ को छोड़ना चाहते हैं या नहीं, यदि आप पृष्ठ पर बने रहने का चयन करते हैं तो आप उन्हें पुनर्निर्देशित नहीं कर सकते। यदि वे छोड़ने का चयन करते हैं, तो ब्राउज़र वहां जाएगा जहां उन्होंने इसे जाने के लिए कहा था।

onunloadपेज अनलोड होने से पहले आप सामान करने के लिए उपयोग कर सकते हैं , लेकिन आप वहां से अनुप्रेषित नहीं कर सकते (Chrome 14+ ब्लॉक अलर्ट अंदर onunload):

window.onunload = function() {
    alert('Bye.');
}

या jQuery के साथ:

$(window).unload(function(){
  alert('Bye.');
});

— रॉकेट हज़मत
स्रोत

12

@ जोसेफ: जब आप किसी स्ट्रिंग से लौटते हैं onbeforeunload, तो ब्राउज़र उस स्ट्रिंग को अपने पुष्टिकरण बॉक्स में डालता है। का प्रयोग confirmमें बेकार है onunloadऔर onbeforeunloadजहां यह, चला जाता है आप नहीं है क्योंकि केवल ब्राउज़र को नियंत्रित कर सकते हैं। इस डेमो को देखें: jsfiddle.net/3kvAC

— रॉकेट हज़मत

7

बस एक ध्यान दें, यदि आप सशर्त में एक संदेश प्रदर्शित करना चाहते हैं onbeforeunload, return falseब्राउज़र शो "गलत" एक संवाद में कर देगा। return undefinedयदि आपको विंडो को बिना किसी उपयोगकर्ता चेतावनी के बंद करने की आवश्यकता है, तो आपको इसकी आवश्यकता होगी ।

— दान फिच

5

@ एडम: फ़ायरफ़ॉक्स ने उस संदेश के अनुकूलन को अस्वीकार करने का निर्णय लिया। यह ब्राउज़र का हिस्सा है, इसलिए आप उस व्यवहार को ओवरराइड नहीं कर सकते। अन्य ब्राउज़र भी संदेश को अनुकूलित करने की क्षमता को हटा सकते हैं। देखें: developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/…

— रॉकेट हज़मत

8

@RocketHazmat क्रोम में भी है। अब यह केवल कहता है: क्या आप इस साइट को छोड़ना चाहते हैं? आपके द्वारा किए गए परिवर्तन सहेजे नहीं जा सकते हैं।

— प्रोग्रामर

6

@ programmer5000 अच्छा है क्योंकि कुछ दुर्भावनापूर्ण वेबसाइटें कुछ बेकार चेतावनी दिखा सकती हैं (उदाहरण के लिए "आप अपनी बैंक जानकारी दिए बिना नहीं छोड़ सकते हैं")

— नमन

34

यह कोड जब आप फॉर्म स्टेट की स्थिति का पता लगाते हैं या नहीं।

$('#form').data('serialize',$('#form').serialize()); // On load save form current state

$(window).bind('beforeunload', function(e){
    if($('#form').serialize()!=$('#form').data('serialize'))return true;
    else e=null; // i.e; if form state change show warning box, else don't show it.
});

आप Google JQuery के फॉर्म को सीरियलाइज़ कर सकते हैं, यह सभी फॉर्म इनपुट एकत्र करेगा और इसे सरणी में बचाएगा। मुझे लगता है कि यह व्याख्या पर्याप्त है :)

— वसीम ए।
स्रोत

किसी भी विचार क्यों यह काम नहीं करेगा? क्या इसे अन्य js फ़ंक्शन / jquery प्लगइन्स द्वारा अधिलेखित किया जा सकता है? मैं एक webrtc ऐप चला रहा हूं और मैं कुछ सामान को "बंद" करना चाहूंगा जब क्लाइंट विंडो को बंद कर देगा और इस तरह विंडो को बंद करने की आवश्यकता होगी।

— अरे

1

इसे किसी अन्य प्लगइन आदि द्वारा अधिलेखित किया जा सकता है, ज्यादातर डेवलपर ने चयनकर्ता के साथ गलती की, यदि आपको ओवरराइट के बारे में संदेह है, तो </ body> टैग के करीब से पहले अपना jquery कोड डालें।

— वसीम ए।

हां ... यदि आपके पास कुछ जेएस कोड है जो पेज लोड होने के बाद इनपुट फ़ील्ड को छुपाता है या अक्षम करता है, तो जब आप छिपे हुए \ अक्षम क्षेत्रों की तुलना करने के लिए जांच करते हैं तो इसे क्रमबद्ध नहीं किया जाएगा। चेक निश्चित रूप से विफल हो जाएगा। ;) इस वर्कअराउंड है: stackoverflow.com/a/4748748/114029

— लेनियल मैकाफेर्री

वैसे ... यहाँ एक बेहतर तरीका है: stackoverflow.com/q/16322042/114029

— लेनियल मैकाफेर्री

1

ध्यान दिया जाना चाहिए कि यह सबमिट बटन दबाते समय एक चेतावनी भी बढ़ाएगा। इसे रोकने के लिए सबमिट बटन पर क्लिक करने पर फॉर्म फिर से अनुक्रमित हो सकता है।

— एडम

19

यह वर्तमान पृष्ठ छोड़ने पर अलर्ट करेगा

<script type='text/javascript'>
function goodbye(e) {
    if(!e) e = window.event;
    //e.cancelBubble is supported by IE - this will kill the bubbling process.
    e.cancelBubble = true;
    e.returnValue = 'You sure you want to leave?'; //This is displayed on the dialog

    //e.stopPropagation works in Firefox.
    if (e.stopPropagation) {
        e.stopPropagation();
        e.preventDefault();
    }
}
window.onbeforeunload=goodbye; 

</script>

— अजीत सिंह
स्रोत

13

जब मैंने बिना डेटा के पुष्टि की है कि मैंने पुष्टि संदेश दिखाया था

window.onbeforeunload = function () {
            if (isDirty) {
                return "There are unsaved data.";
            }
            return undefined;
        }

"अपरिभाषित" लौटने से पुष्टि अक्षम हो जाएगी

नोट: "शून्य" लौटाने से IE के साथ काम नहीं करेगा

इसके अलावा, आप पुष्टि को अक्षम करने के लिए "अपरिभाषित" का उपयोग कर सकते हैं

window.onbeforeunload = undefined;

— मीना मटका
स्रोत

11

Chrome 14+ के साथ पॉपअप रखने के लिए, आपको निम्नलिखित कार्य करने होंगे:

jQuery(window).bind('beforeunload', function(){
    return 'my text';
});

उपयोगकर्ता से पूछा जाएगा कि क्या वह रहना चाहता है या छोड़ना चाहता है।

— डेविड बेलांगेर
स्रोत

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

— अरे

@ वह क्यों नीचे वोट? यह काम कर रहा है .... आपको यह सुनिश्चित करने की आवश्यकता है कि यह बाहर है jQuery(document)और मैं इसे आपके सभी प्लगइन्स लोड होने के बाद सही रखने का सुझाव देता हूं। इसके अलावा, यह स्निपेट कोई अलर्ट नहीं करता है ... यह केवल एक डेमो है return।

— डेविड बेलांगेर

7

पेज छोड़ने से पहले उपयोगकर्ता से हमेशा पूछने के लिए आप निम्नलिखित एक-लाइनर का उपयोग कर सकते हैं ।

window.onbeforeunload = s => "";

उपयोगकर्ता से यह पूछने के लिए कि पृष्ठ पर कुछ संशोधित किया गया है, इस उत्तर को देखें ।

— spencer.sm
स्रोत

क्या यह भी आग है अगर मैं पृष्ठ को ताज़ा करता हूं या बस बाहर निकलता हूं

— Si8

हाँ, यह एक ताज़ा या बाहर आग जाएगा।

— स्पेन्सर.स्वामी

वैसे भी क्या यह जानना है कि यह पहली बार कब ताज़ा है?

— Si8

जब कोई उपयोगकर्ता पृष्ठ पर पहली बार आता है तो पृष्ठ को ताज़ा करने वाले उपयोगकर्ता का विरोध करता है।

— Si8

अरे नहीं। जब कोई उपयोगकर्ता पहली बार पृष्ठ पर आता है तो उसे निकाल नहीं दिया जाएगा। केवल पृष्ठ बंद करने या बदलने या ताज़ा करने पर।

— spencer.sm

4

आम तौर पर आप इस संदेश को दिखाना चाहते हैं, जब उपयोगकर्ता ने एक फॉर्म में बदलाव किए हैं, लेकिन वे सहेजे नहीं गए हैं।

एक संदेश दिखाने के लिए इस दृष्टिकोण को लें, केवल जब उपयोगकर्ता ने कुछ बदल दिया है

var form = $('#your-form'),
  original = form.serialize()

form.submit(function(){
  window.onbeforeunload = null
})

window.onbeforeunload = function(){
  if (form.serialize() != original)
    return 'Are you sure you want to leave?'
}

— साइमन फ्रेंज़ेन
स्रोत

3

<!DOCTYPE html>
<html>
<body onbeforeunload="return myFunction()">

<p>Close this window, press F5 or click on the link below to invoke the onbeforeunload event.</p>

<a href="https://www.w3schools.com">Click here to go to w3schools.com</a>

<script>
function myFunction() {
    return "Write something clever here...";
}
</script>

</body>
</html>

https://www.w3schools.com/tags/ev_onbeforeunload.asp

— अमीर ममाशोव
स्रोत

1

बस थोड़ा और अधिक सहायक, सक्षम और अक्षम करें

$(window).on('beforeunload.myPluginName', false); // or use function() instead of false
$(window).off('beforeunload.myPluginName');

— l2aelba
स्रोत

1

यहाँ अधिकांश समाधान मेरे काम नहीं आए इसलिए मैंने यहाँ पाए गए का उपयोग किया

मैंने पुष्टिकरण बॉक्स को अनुमति देने के लिए एक चर भी जोड़ा या नहीं

window.hideWarning = false;
window.addEventListener('beforeunload', (event) => {
    if (!hideWarning) {
        event.preventDefault();
        event.returnValue = '';
    }

});

— राज शर्मा
स्रोत