यह आलेख चर्चा करता है कि जावास्क्रिप्ट में सामग्री-संपादन योग्य परिवर्तन घटनाओं को कैसे संभालना है और इसे एक उदाहरण की सहायता से समझाया गया है।
जावास्क्रिप्ट में कंटेंटएडिटेबल परिवर्तन की घटनाओं को कैसे संभालें?
संतोषप्रद एक प्रगणित विशेषता है। उपयोगकर्ता अपनी आवश्यकताओं को ध्यान में रखते हुए सामग्री में परिवर्तन कर सकता है। यदि इसकी अनुमति है, तो ब्राउज़र तत्वों को संशोधित करने की अनुमति देने के लिए अपने विजेट को बदल देता है।
एक संतोषप्रद परिवर्तन घटना द्वारा किन मूल्यों की अनुमति है?
संतोषप्रद इनमें से कोई भी मान ले सकता है:
- प्लेनटेक्स्ट-ओनली दर्शाता है कि मूल टेक्स्ट को संपादित किया जा सकता है, हालांकि रिच टेक्स्ट फ़ॉर्मेटिंग अक्षम है।
- एक खाली स्ट्रिंग या सत्य जिसका अर्थ है कि तत्व को संपादित किया जा सकता है।
- गलत जिसका अर्थ यह है कि तत्व को संपादित नहीं किया जा सकता।
उदाहरण
निम्नलिखित उदाहरण बताता है कि वेब पेज पर संपादन योग्य सामग्री का उपयोग कैसे किया जा सकता है। आइए इसे बेहतर ढंग से समझने के लिए नीचे दिए गए कोड को देखें:
एचटीएमएल
यहां एक HTML कोड है जो सामग्री-संपादन योग्य परिवर्तन घटनाओं के उपयोग की व्याख्या करता है:
< ब्लॉककोट संतोषप्रद = 'सत्य' >
< h3 > अपनी सामग्री यहाँ संपादित करें! < / h3 >
< / ब्लॉककोट >
उपरोक्त HTML कोड में:
- एक ब्लॉककोट टैग को कंटेंटएडिटेबल विशेषता को सत्य पर सेट करके बनाया जाता है। यह ब्लॉककोट टैग के अंदर की सामग्री को संपादित करने में सक्षम करेगा।
- ब्लॉककोट टैग के अंदर एक h3 टैग मौजूद होता है। यह कहता है 'अपनी सामग्री यहां संपादित करें!', क्योंकि यह <ब्लॉककोट> के अंदर मौजूद है, जिसका अर्थ है कि सामग्री को उपयोगकर्ता द्वारा संपादित किया जा सकता है।
सीएसएस
अपने कोड को दृश्य रूप से आकर्षक बनाने के लिए, हमने निम्नलिखित CSS कोड का उपयोग किया है:
ब्लॉककोट {
पृष्ठभूमि : पीचपफ ;
बॉर्डर-त्रिज्या : 10px ;
अंतर : 10px ;
}
ब्लॉककोट h3 {
गद्दी : 10px ;
}
उपरोक्त सीएसएस कोड में:
- ब्लॉककोट टैग पृष्ठभूमि को 10px के बॉर्डर-त्रिज्या और 10px के मार्जिन के साथ आड़ू रंग में सेट किया गया है।
- ब्लॉककोट के अंदर h3 शीर्षक को 10px की पैडिंग के लिए सेट किया गया है।
उत्पादन :
निम्नलिखित आउटपुट बताता है कि जावास्क्रिप्ट में contenteditable परिवर्तन इवेंट का उपयोग करके सामग्री को कैसे संपादित किया जा सकता है:
सामग्री को संपादित करने का महत्व
- बढ़ी हुई अन्तरक्रियाशीलता क्योंकि उपयोगकर्ता सामग्री को आसानी से संशोधित कर सकता है।
- जावास्क्रिप्ट की मदद से एक प्रोग्रामर के रूप में सुविधाजनक अनुकूलन, उपयोगकर्ता इनपुट के आधार पर विभिन्न क्रियाओं को ट्रिगर करते हुए, ऑटोसेविंग जैसे संशोधित व्यवहार बना सकता है।
- संपादन प्रक्रिया को सुव्यवस्थित करने में मदद करता है जिससे उपयोगकर्ता को अलग पाठ फ़ील्ड की आवश्यकता के बिना गतिशील रूप से संपादित करने की अनुमति मिलती है।
निष्कर्ष
जावास्क्रिप्ट में सामग्री-संपादन योग्य परिवर्तन घटनाएँ उपयोगकर्ता को वेबपेज को उत्तरदायी और अनुकूलन योग्य बनाने वाली सामग्री को संशोधित करने में सक्षम बनाती हैं। यह उपयोगकर्ता-केंद्रित वेब विकास का मार्ग प्रशस्त करता है जहां उपयोगकर्ता अधिक प्रतिक्रियाशील उपयोगकर्ता अनुभव को सक्षम करने के लिए वास्तविक समय में वेब पेज पर सामग्री को संपादित कर सकता है। इस लेख में चर्चा की गई है कि जावास्क्रिप्ट में संतोषजनक परिवर्तन की घटनाओं को कैसे संभालना है और इसे एक उदाहरण की मदद से समझाया गया है।