ब्राउज़र बैक बटन के साथ वापस जाने पर सभी फ़ील्ड को एक रूप में साफ़ करें

Question 1

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

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

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

Question 2

आधुनिक ब्राउज़र कुछ को आगे-पीछे कैश (BFCache) के रूप में जाना जाता है। जब आप वापस / आगे बटन दबाते हैं तो वास्तविक पृष्ठ पुनः लोड नहीं किया जाता है (और स्क्रिप्ट कभी भी फिर से नहीं चलती हैं)।

यदि आपको उपयोगकर्ता को आगे / आगे की चाबियाँ मारने के मामले में कुछ करना है - तो BFCache pageshowऔर pagehideघटनाओं के लिए सुनें :

window.addEventListener("pageshow", () => {
  // update hidden input field
});

गेको और वेबिट कार्यान्वयन के लिए अधिक विवरण देखें ।

Question 3

जावास्क्रिप्ट के बिना दूसरा तरीका <form autocomplete="off">यह है कि अंतिम मानों के साथ फ़ॉर्म को फिर से भरने से ब्राउज़र को रोकने के लिए उपयोग किया जाए।

यह प्रश्न भी देखें

<input type="text"प्रपत्र के अंदर केवल एक > के साथ यह परीक्षण किया गया, लेकिन वर्तमान क्रोम और फ़ायरफ़ॉक्स में ठीक काम करता है, दुर्भाग्य से IE10 में नहीं।

Question 4

क्रोम में BFCache (बैक / फॉरवर्ड बटन कैश) से संबंधित पूरे फॉर्म को क्लियर करने का तरीका खोजते हुए मैं इस पोस्ट पर आया।

सिम ने क्या आपूर्ति की, इसके अलावा मेरे उपयोग के मामले में यह आवश्यक था कि बैक बटन पर क्लीयर फॉर्म के साथ संयुक्त विवरण की आवश्यकता हो ? ।

मैंने पाया कि ऐसा करने का सबसे अच्छा तरीका यह है कि फ़ॉर्म की अपेक्षा के अनुसार व्यवहार करने की अनुमति दी जाए, और एक घटना को ट्रिगर किया जाए:

$(window).bind("pageshow", function() {
    var form = $('form'); 
    // let the browser natively reset defaults
    form[0].reset();
});

यदि आप inputजावास्क्रिप्ट में एक वस्तु उत्पन्न करने के लिए घटनाओं को नहीं संभाल रहे हैं , या उस मामले के लिए कुछ और, तो आप कर रहे हैं। हालाँकि, यदि आप घटनाओं को सुन रहे हैं, तो कम से कम क्रोम में आपको changeस्वयं एक घटना को ट्रिगर करने की आवश्यकता है (या जो भी घटना आप संभालना चाहते हैं, जिसमें एक कस्टम भी शामिल है):

form.find(':input').not(':button,:submit,:reset,:hidden').trigger('change');

यही कारण है कि जोड़ा जाना चाहिए के बादreset किसी भी अच्छा करने के लिए।

Question 5

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

$(window).load(function() {
    $('form').get(0).reset(); //clear form data on page load
});

Question 6

इसी से मेरा काम बना है।

$(window).bind("pageshow", function() {
    $("#id").val('');
    $("#another_id").val('');
});

मैंने शुरू में इसे $(document).readyअपने jquery के अनुभाग में लिया था , जिसमें काम भी किया था। हालांकि, मैंने सुना है कि सभी ब्राउज़र $(document).readyबैक बटन पर नहीं चलते हैं, इसलिए मैंने इसे निकाल लिया। मैं इस दृष्टिकोण के पेशेवरों और विपक्षों को नहीं जानता, लेकिन मैंने कई ब्राउज़रों और कई उपकरणों पर परीक्षण किया है, और इस समाधान के साथ कोई समस्या नहीं मिली।

Question 7

नीचे दिए गए लिंक आपकी मदद कर सकते हैं ..

ब्राउज़र बैक बटन खाली फ़ील्ड को पुनर्स्थापित करता है , बैक बटन पर स्पष्ट फ़ॉर्म?

आशा है कि यह मदद करता है ... बेस्ट लक