जावास्क्रिप्ट alert() विधि, जिसे Window.alert() . के नाम से भी जाना जाता है , उपयोगकर्ता को एक अलर्ट डायलॉग बॉक्स प्रदर्शित करता है। यह उपयोगकर्ता को ओके बटन के साथ संदेश प्रदर्शित करने के लिए वैकल्पिक संदेश तर्क को स्वीकार करता है। alert() . के सामान्य उपयोग उपयोगकर्ता को यह बताने के लिए कि कोई कार्रवाई सफल रही, या त्रुटियों को प्रदर्शित करने के लिए।
alert() विधि एक विकास उपकरण के रूप में भी काम आती है। उदाहरण के लिए, alert() लगाना फ़ॉर्म सबमिशन को संभालने के लिए फ़ंक्शन के अंदर। आमतौर पर, alert() event.preventDefault() after के बाद रखा जाएगा कहा जाता है।
समीक्षा के लिए, event.preventDefault() सबमिट बटन पर क्लिक करने के बाद रीडायरेक्ट करने के डिफ़ॉल्ट व्यवहार को बस रद्द कर देता है। event.preventDefault() . की और समीक्षा करने के लिए इस त्वरित ट्यूटोरियल को पढ़ें ।
JavaScript अलर्ट क्या है ()?
जावास्क्रिप्ट alert() एक पॉप-अप डायलॉग बॉक्स प्रदर्शित करता है। एक कस्टम संदेश प्रदर्शित करने के लिए एक स्ट्रिंग के रूप में एक वैकल्पिक संदेश पारित किया जा सकता है। alert() के बारे में एक महत्वपूर्ण नोट क्या इसका उपयोग केवल उस संदेश को प्रदर्शित करने के लिए किया जाना चाहिए जिसके लिए ओके पर क्लिक करके पावती की आवश्यकता होती है। किसी कार्रवाई की आवश्यकता वाले संदेश को alert() . का उपयोग नहीं करना चाहिए .
एक alert() डायलॉग बॉक्स के कई उपयोग हैं। इसका उपयोग fetch() . के संदर्भ में सफलता या त्रुटियों को प्रदर्शित करने के लिए किया जा सकता है प्रार्थना। एक अन्य उपयोग alert() display प्रदर्शित करना है एक समारोह में यह सुनिश्चित करने के लिए कि कार्यक्रम उचित रूप से बह रहा है।
अलर्ट () JavaScript सिंटैक्स
alert() . के लिए सिंटैक्स संक्षिप्त और सीधा है। बस alert() का आह्वान करें एक स्ट्रिंग के रूप में एक संदेश के साथ:
अलर्ट ('मैसेज')
यह एक संवाद बॉक्स प्रदर्शित करेगा जो 'संदेश' कहेगा। इसे प्रदर्शित करने के लिए अपने कस्टम संदेश को एक स्ट्रिंग के रूप में रखें।
संदेश वैकल्पिक है। यदि कोई संदेश शामिल नहीं है, तो OK बटन वाला एक रिक्त संवाद बॉक्स प्रकट होता है।
81% प्रतिभागियों ने कहा कि बूटकैंप में भाग लेने के बाद उन्हें अपनी तकनीकी नौकरी की संभावनाओं के बारे में अधिक आत्मविश्वास महसूस हुआ। आज ही एक बूटकैंप से मिलान करें।
बूटकैंप शुरू करने से लेकर अपनी पहली नौकरी खोजने तक, औसत बूटकैंप ग्रेड ने करियर संक्रमण में छह महीने से भी कम समय बिताया।
<पूर्व>अलर्ट ()जावास्क्रिप्ट अलर्ट () उदाहरण
इस लेख की शुरूआत में, हमने alert() . का उपयोग करने के लिए एक उपयोगकर्ता और एक डेवलपर परिदृश्य पर विचार किया . आइए अब देखें कि प्रत्येक को कैसे लागू किया जाएगा। आइए डेवलपर पक्ष से शुरू करें। हम एक alert() डालेंगे एक फ़ंक्शन के अंदर जो फॉर्म सबमिशन को संभालता है।
हम यूजरनेम और पासवर्ड के साथ लॉग इन करने के लिए एक बेसिक फॉर्म से शुरुआत करेंगे।
<फॉर्म> <लेबल> नाम <इनपुट प्रकार ="टेक्स्ट" नाम ="नाम"> <लेबल> पासवर्ड <इनपुट प्रकार ="टेक्स्ट" नाम ="नाम"> <बटन type="submit">लॉग इन करें
जो प्रस्तुत करता है:
अब हमारे जावास्क्रिप्ट फॉर्म की ऑनसबमिट प्रॉपर्टी को पास करने के लिए एक फंक्शन बनाते हैं।
const handleOnSubmit =(ईवेंट) => {event.preventDefault(); चेतावनी ("लॉग इन")}
फिर हम इस फ़ंक्शन को ऑनसबमिट प्रॉपर्टी में अपने फॉर्म में पास करते हैं।
अब हम यह देखने के लिए लॉगिन बटन पर क्लिक कर सकते हैं कि क्या हमने फ़ंक्शन को फ़ॉर्म में ठीक से वायर किया है। बटन पर क्लिक करने के बाद हमें एक डायलॉग बॉक्स मिलता है जो इस तरह दिखता है:
महान! हम जानते हैं कि हमने जो कार्य परिभाषित किया है वह हमारे रूप के साथ संचार कर रहा है। जावास्क्रिप्ट alert() हमें अपने कार्यक्रम के प्रवाह की जांच करने का एक आसान तरीका देता है।
हमारे अगले उदाहरण के लिए, आइए देखें कि हम fetch() में सफलता और त्रुटि संदेशों को कैसे उजागर कर सकते हैं प्रार्थना।
fetch('/current-cart/', { क्रेडेंशियल:'include', method:'GET', हेडर्स:{'Content-Type':'application/json' }, }) .then(resp => resp.json ()) .then(cart => {if(cart.error){ अलर्ट (cart.error) }
इस उदाहरण में, हमारे पास ई-कॉमर्स ऐप में शॉपिंग कार्ट लाने का अनुरोध है। हम यह देखने के लिए एक अनुरोध भेज रहे हैं कि क्या कोई वर्तमान शॉपिंग कार्ट संग्रहीत किया गया है। अनुरोध को अंत तक देखते हुए, हमारे पास एक alert() है जो त्रुटियों को प्रदर्शित करेगा, यदि कोई हो।
चूंकि कोई सक्रिय शॉपिंग कार्ट नहीं है, इसलिए हमें यह त्रुटि मिलती है:
यह उदाहरण उत्पादन की तुलना में विकास में अधिक उपयोगी है, लेकिन समान सिद्धांतों को उदाहरण के लिए किसी प्रपत्र पर सत्यापन के रूप में लागू किया जा सकता है।
रिटर्न फ़ेच ('/ लॉगिन', { क्रेडेंशियल:'शामिल', विधि:'पोस्ट', हेडर:{'कंटेंट-टाइप':'एप्लिकेशन/जेसन'}, बॉडी:JSON.stringify (क्रेडिट्स)}) .then(resp => resp.json()) .then(response => { if (response.error) {चेतावनी (response.error)}
यहां, alert() लॉग-इन फॉर्म से जुड़े त्रुटि संदेशों को प्रदर्शित करेगा। यदि कोई उपयोगकर्ता बिना फॉर्म भरे लॉग-इन करने का प्रयास करता है, तो हमें ये त्रुटियां मिलती हैं:
यह alert() . का उपयोग करके उपयोगकर्ता अनुभव को निर्देशित करने का एक उदाहरण है सत्यापन प्रदर्शित करने के लिए।
हमने देखा है कि कैसे alert() विकास पक्ष और ग्राहक पक्ष दोनों का उपयोग किया जा सकता है - जो उपयोगकर्ता देखता है। हमने जो सीखा है उसे फिर से लिखने के लिए कुछ समय दें।
निष्कर्ष
जावास्क्रिप्ट alert() एक सरल विधि है जिसके कई व्यापक उपयोग हैं। यह एक स्ट्रिंग डेटा प्रकार के रूप में एक संदेश का वैकल्पिक तर्क लेता है। यह संदेश और ओके बटन के साथ एक डायलॉग बॉक्स प्रदर्शित करता है। याद रखें कि alert() केवल संदेश प्रदर्शित करने के लिए है और कोई कार्रवाई करने में सक्षम नहीं है।
हमारे उदाहरणों में, हमने देखा कि कैसे alert() किसी फ़ंक्शन और प्रपत्र के संचार को ट्रैक करने के लिए विकास में उपयोग किया जा सकता है। फिर, हमने देखा कि कैसे alert() फ़ेच अनुरोध के विकास पक्ष में त्रुटि संदेशों को उजागर कर सकता है। हमारे अंतिम उदाहरण में, हमने देखा कि कैसे alert() किसी उपयोगकर्ता को सत्यापन त्रुटियों को प्रपत्र में वितरित करने के लिए उपयोग किया जा सकता है।
अब तक, आपको alert() . के सामान्य उपयोगों की समझ होनी चाहिए . विभिन्न कार्यात्मकताओं का परीक्षण करने के तरीके के रूप में इसे अपने अगले JavaScript प्रोजेक्ट में आज़माएँ।