jQuery और Regex (रेगुलर एक्सप्रेशन्स) का संयोजन वेब डेवलपर्स के लिए एक शक्तिशाली उपकरण है। यह संयोजन आपको HTML तत्वों और उनके कंटेंट को अधिक सटीकता से खोजने, मिलान करने और हेरफेर करने की अनुमति देता है। jQuery का उपयोग करके आप वेब पेज के विभिन्न हिस्सों को आसानी से मैनिपुलेट कर सकते हैं, जबकि Regex आपको टेक्स्ट पैटर्न को पहचानने और प्रोसेस करने में मदद करता है।
इस अध्याय में, हम jQuery और Regex के उपयोग के विभिन्न पहलुओं को समझेंगे। हम निम्नलिखित महत्वपूर्ण बिंदुओं पर चर्चा करेंगे:
- Regex का परिचय (Introduction to Regex): Regex क्या है और इसका महत्व।
- jQuery में Regex का उपयोग (Using Regex in jQuery): jQuery के साथ Regex का उपयोग कैसे करें।
- साधारण मिलान (Simple Matching): Regex का उपयोग करके साधारण टेक्स्ट मिलान कैसे करें।
- Regex के साथ डेटा वेलिडेशन (Data Validation with Regex): Regex का उपयोग करके फॉर्म डेटा की वेलिडेशन कैसे करें।
- Regex और jQuery का संयोजन (Combining Regex and jQuery): jQuery के साथ Regex को मिलाकर जटिल कार्य कैसे करें।
इस अध्याय के अंत तक, आप सीखेंगे कि कैसे jQuery और Regex का उपयोग करके अपने वेब पेज पर टेक्स्ट मैनिपुलेशन, डेटा वेलिडेशन, और अन्य उन्नत कार्यों को सरल और प्रभावी ढंग से किया जा सकता है। आइए, jQuery और Regex की इस रोचक यात्रा को शुरू करें और इसके शक्तिशाली फीचर्स का लाभ उठाएं।
Regex का परिचय (Introduction to Regex)
Regex, जिसे रेगुलर एक्सप्रेशन भी कहा जाता है, एक शक्तिशाली टूल है जो टेक्स्ट स्ट्रिंग्स में पैटर्न को पहचानने और प्रोसेस करने के लिए उपयोग किया जाता है। यह वेब डेवलपमेंट और डेटा प्रोसेसिंग में व्यापक रूप से उपयोग होता है, क्योंकि यह आपको टेक्स्ट को सर्च, वेलिडेट, और मैनिपुलेट करने की अनुमति देता है।
Regex क्या है?
Regex एक टेक्स्ट स्ट्रिंग होती है जो एक विशेष पैटर्न को परिभाषित करती है। इसे विशेष सिंटैक्स और मेटा कैरेक्टर्स का उपयोग करके लिखा जाता है, जो पैटर्न को परिभाषित करते हैं। Regex का उपयोग विभिन्न प्रोग्रामिंग भाषाओं और टूल्स में किया जा सकता है, जैसे कि Python, JavaScript, PHP, और jQuery।
उदाहरण:
- ^abc: स्ट्रिंग की शुरुआत में ‘abc’ को खोजता है।
- abc$: स्ट्रिंग के अंत में ‘abc’ को खोजता है।
- a.c: ‘a’ के बाद किसी भी एक कैरेक्टर और फिर ‘c’ को खोजता है।
- \d: एक डिजिट (0-9) को खोजता है।
- [a-z]: छोटे अक्षरों (a से z) में से किसी एक को खोजता है।
Regex का महत्व
- टेक्स्ट सर्च और मिलान (Text Search and Matching): Regex का मुख्य उपयोग टेक्स्ट स्ट्रिंग्स में पैटर्न को सर्च और मिलान करने में होता है। यह आपको किसी विशेष पैटर्न को खोजने और उसे प्रोसेस करने की अनुमति देता है, जिससे टेक्स्ट प्रोसेसिंग बहुत आसान हो जाती है।
- डेटा वेलिडेशन (Data Validation): Regex का उपयोग फॉर्म इनपुट्स और अन्य डेटा की वेलिडेशन के लिए किया जाता है। यह सुनिश्चित करता है कि उपयोगकर्ता द्वारा दर्ज किया गया डेटा एक निश्चित पैटर्न का पालन करता है। उदाहरण के लिए, आप ईमेल एड्रेस, फोन नंबर, और पासवर्ड की वेलिडेशन के लिए Regex का उपयोग कर सकते हैं।
- टेक्स्ट मैनिपुलेशन (Text Manipulation): Regex का उपयोग टेक्स्ट को मैनिपुलेट करने के लिए भी किया जाता है। यह आपको टेक्स्ट को रिप्लेस, स्प्लिट, और एक्सट्रेक्ट करने की अनुमति देता है, जिससे आप जटिल टेक्स्ट प्रोसेसिंग कार्यों को सरल बना सकते हैं।
- वेब स्क्रैपिंग (Web Scraping): वेब स्क्रैपिंग के दौरान, Regex का उपयोग वेब पेजों से विशेष पैटर्न को पहचानने और डेटा को एक्सट्रेक्ट करने के लिए किया जाता है। यह वेब स्क्रैपिंग को अधिक कुशल और प्रभावी बनाता है।
Regex के कुछ सामान्य उपयोग
ईमेल वेलिडेशन: एक ईमेल एड्रेस के सही फॉर्मेट को सुनिश्चित करना।
var emailPattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
फोन नंबर वेलिडेशन: एक फोन नंबर के सही फॉर्मेट को सुनिश्चित करना।
var phonePattern = /^\d{10}$/;
पासवर्ड वेलिडेशन: एक पासवर्ड के सही फॉर्मेट को सुनिश्चित करना (कम से कम एक अक्षर और एक नंबर के साथ 8-16 कैरेक्टर्स लंबा)।
var passwordPattern = /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,16}$/;
jQuery में Regex का उपयोग (Using Regex in jQuery)
jQuery और Regex का संयोजन आपको HTML तत्वों और उनके कंटेंट को सर्च, वेलिडेट, और मैनिपुलेट करने की अनुमति देता है। jQuery के साथ Regex का उपयोग करके आप विभिन्न प्रकार के टेक्स्ट पैटर्न को आसानी से पहचान सकते हैं और उन पर ऑपरेशन्स कर सकते हैं। इस सेक्शन में, हम देखेंगे कि कैसे jQuery के साथ Regex का उपयोग किया जा सकता है।
1. टेक्स्ट मिलान और रिप्लेसमेंट (Text Matching and Replacement)
jQuery का उपयोग करके आप HTML तत्वों के टेक्स्ट कंटेंट को प्राप्त कर सकते हैं और Regex का उपयोग करके उन्हें सर्च और रिप्लेस कर सकते हैं।
उदाहरण:
<!DOCTYPE html>
<html>
<head>
<title>jQuery and Regex Example</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#replaceButton").click(function(){
var paragraph = $("#myParagraph").text();
// Regex का उपयोग करके टेक्स्ट को सर्च और रिप्लेस करना
var updatedParagraph = paragraph.replace(/jQuery/g, "JavaScript");
$("#myParagraph").text(updatedParagraph);
});
});
</script>
</head>
<body>
<p id="myParagraph">jQuery is a fast, small, and feature-rich JavaScript library. jQuery makes things like HTML document traversal and manipulation, event handling, and animation simple.</p>
<button id="replaceButton">Replace Text</button>
</body>
</html>
इस उदाहरण में, जब बटन (#replaceButton) पर क्लिक किया जाता है, तब #myParagraph में मौजूद ‘jQuery’ शब्द को ‘JavaScript’ से रिप्लेस किया जाता है।
2. इनपुट वेलिडेशन (Input Validation)
Regex का उपयोग फॉर्म इनपुट्स की वेलिडेशन के लिए किया जा सकता है। आप jQuery का उपयोग करके इनपुट्स से डेटा प्राप्त कर सकते हैं और Regex का उपयोग करके उसकी वेलिडिटी चेक कर सकते हैं।
उदाहरण: ईमेल वेलिडेशन
<!DOCTYPE html>
<html>
<head>
<title>jQuery and Regex Email Validation</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#validateButton").click(function(){
var email = $("#emailInput").val();
// Regex का उपयोग करके ईमेल वेलिडेशन
var emailPattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
if (emailPattern.test(email)) {
alert("Valid email address!");
} else {
alert("Invalid email address. Please try again.");
}
});
});
</script>
</head>
<body>
<label for="emailInput">Email:</label>
<input type="text" id="emailInput">
<button id="validateButton">Validate Email</button>
</body>
</html>
इस उदाहरण में, जब बटन (#validateButton) पर क्लिक किया जाता है, तब #emailInput इनपुट का वैल्यू प्राप्त किया जाता है और Regex का उपयोग करके उसकी वेलिडिटी चेक की जाती है।
3. मल्टीपल पैटर्न सर्च (Multiple Pattern Search)
Regex का उपयोग करके आप मल्टीपल पैटर्न्स को एक साथ सर्च कर सकते हैं और उनकी उपस्थिति का पता लगा सकते हैं।
उदाहरण: URL सर्च
<!DOCTYPE html>
<html>
<head>
<title>jQuery and Regex URL Search</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#searchButton").click(function(){
var text = $("#textContent").text();
// Regex का उपयोग करके URL सर्च करना
var urlPattern = /(https?:\/\/[^\s]+)/g;
var urls = text.match(urlPattern);
if (urls) {
alert("Found URLs: " + urls.join(", "));
} else {
alert("No URLs found.");
}
});
});
</script>
</head>
<body>
<div id="textContent">Visit https://www.example.com and http://www.test.com for more information.</div>
<button id="searchButton">Search URLs</button>
</body>
</html>
इस उदाहरण में, जब बटन (#searchButton) पर क्लिक किया जाता है, तब #textContent में मौजूद टेक्स्ट से सभी URLs को सर्च करके उनकी सूची प्रदर्शित की जाती है।
4. फॉर्मेटिंग और सफाई (Formatting and Sanitizing)
Regex का उपयोग करके आप टेक्स्ट को एक निश्चित फॉर्मेट में बदल सकते हैं और अनचाहे कैरेक्टर्स को हटा सकते हैं।
उदाहरण: फोन नंबर फॉर्मेटिंग
<!DOCTYPE html>
<html>
<head>
<title>jQuery and Regex Phone Number Formatting</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#formatButton").click(function(){
var phoneNumber = $("#phoneInput").val();
// Regex का उपयोग करके फोन नंबर फॉर्मेट करना
var formattedPhoneNumber = phoneNumber.replace(/(\d{3})(\d{3})(\d{4})/, '($1) $2-$3');
$("#phoneInput").val(formattedPhoneNumber);
});
});
</script>
</head>
<body>
<label for="phoneInput">Phone Number:</label>
<input type="text" id="phoneInput" placeholder="1234567890">
<button id="formatButton">Format Phone Number</button>
</body>
</html>
इस उदाहरण में, जब बटन (#formatButton) पर क्लिक किया जाता है, तब #phoneInput में दर्ज फोन नंबर को फॉर्मेट करके (123) 456-7890 के रूप में प्रदर्शित किया जाता है।
jQuery और Regex का उपयोग एक साथ करके आप HTML तत्वों और उनके कंटेंट पर विभिन्न प्रकार के ऑपरेशन्स कर सकते हैं। आप टेक्स्ट को सर्च और रिप्लेस कर सकते हैं, इनपुट वेलिडेशन कर सकते हैं, मल्टीपल पैटर्न्स को सर्च कर सकते हैं, और टेक्स्ट को फॉर्मेट और साफ कर सकते हैं। इन तकनीकों का उपयोग करके आप अपने वेब पेज को अधिक इंटरैक्टिव और उपयोगकर्ता-अनुकूल बना सकते हैं।
साधारण मिलान (Simple Matching)
Regex (रेगुलर एक्सप्रेशन्स) का उपयोग करके आप टेक्स्ट स्ट्रिंग्स में साधारण पैटर्न्स को आसानी से सर्च और मिलान कर सकते हैं। यह तकनीक वेब डेवलपमेंट में बहुत उपयोगी होती है, विशेष रूप से जब आपको किसी विशेष पैटर्न को पहचानने और प्रोसेस करने की आवश्यकता होती है। jQuery के साथ Regex का उपयोग करके, आप HTML तत्वों के टेक्स्ट कंटेंट को प्राप्त कर सकते हैं और उनमें सरल मिलान कर सकते हैं।
1. टेक्स्ट मिलान (Text Matching)
Regex का सबसे सामान्य उपयोग टेक्स्ट स्ट्रिंग्स में पैटर्न को मिलान करने के लिए किया जाता है। आप jQuery का उपयोग करके HTML तत्वों से टेक्स्ट प्राप्त कर सकते हैं और उसमें Regex का उपयोग करके मिलान कर सकते हैं।
उदाहरण: किसी शब्द का मिलान
<!DOCTYPE html>
<html>
<head>
<title>Simple Matching Example</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#matchButton").click(function(){
var paragraph = $("#myParagraph").text();
// Regex का उपयोग करके शब्द का मिलान करना
var pattern = /jQuery/;
if (pattern.test(paragraph)) {
alert("The word 'jQuery' was found in the paragraph.");
} else {
alert("The word 'jQuery' was not found in the paragraph.");
}
});
});
</script>
</head>
<body>
<p id="myParagraph">jQuery is a fast, small, and feature-rich JavaScript library.</p>
<button id="matchButton">Match Text</button>
</body>
</html>
इस उदाहरण में, जब बटन (#matchButton) पर क्लिक किया जाता है, तब #myParagraph के टेक्स्ट में ‘jQuery’ शब्द का मिलान किया जाता है और एक अलर्ट बॉक्स में परिणाम प्रदर्शित होता है।
2. कैरेक्टर क्लास का उपयोग (Using Character Classes)
Regex में कैरेक्टर क्लास का उपयोग करके आप किसी विशेष प्रकार के कैरेक्टर्स को मिलान कर सकते हैं, जैसे कि अंक, अक्षर, या विशेष कैरेक्टर्स।
उदाहरण: डिजिट्स का मिलान
<!DOCTYPE html>
<html>
<head>
<title>Character Class Matching Example</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#matchButton").click(function(){
var text = $("#myText").text();
// Regex का उपयोग करके डिजिट्स का मिलान करना
var pattern = /\d+/;
var result = text.match(pattern);
if (result) {
alert("Found digits: " + result[0]);
} else {
alert("No digits found in the text.");
}
});
});
</script>
</head>
<body>
<div id="myText">The price is 100 dollars.</div>
<button id="matchButton">Match Digits</button>
</body>
</html>
इस उदाहरण में, जब बटन (#matchButton) पर क्लिक किया जाता है, तब #myText में मौजूद डिजिट्स का मिलान किया जाता है और परिणाम अलर्ट बॉक्स में प्रदर्शित होता है।
3. विशेष कैरेक्टर मिलान (Matching Special Characters)
Regex का उपयोग करके आप विशेष कैरेक्टर्स, जैसे कि डॉट्स, हैशटैग्स, या डॉलर साइन, का भी मिलान कर सकते हैं।
उदाहरण: डॉलर साइन का मिलान
<!DOCTYPE html>
<html>
<head>
<title>Special Character Matching Example</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#matchButton").click(function(){
var text = $("#myText").text();
// Regex का उपयोग करके डॉलर साइन का मिलान करना
var pattern = /\$/;
if (pattern.test(text)) {
alert("The dollar sign '$' was found in the text.");
} else {
alert("The dollar sign '$' was not found in the text.");
}
});
});
</script>
</head>
<body>
<div id="myText">The total cost is $50.</div>
<button id="matchButton">Match Dollar Sign</button>
</body>
</html>
इस उदाहरण में, जब बटन (#matchButton) पर क्लिक किया जाता है, तब #myText में मौजूद डॉलर साइन ($) का मिलान किया जाता है और परिणाम अलर्ट बॉक्स में प्रदर्शित होता है।
4. टेक्स्ट एक्सट्रैक्शन (Text Extraction)
Regex का उपयोग करके आप टेक्स्ट स्ट्रिंग्स से विशिष्ट पैटर्न्स को एक्सट्रैक्ट कर सकते हैं।
उदाहरण: ईमेल एड्रेस एक्सट्रैक्ट करना
<!DOCTYPE html>
<html>
<head>
<title>Email Extraction Example</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#extractButton").click(function(){
var text = $("#myText").text();
// Regex का उपयोग करके ईमेल एड्रेस एक्सट्रैक्ट करना
var pattern = /[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}/;
var result = text.match(pattern);
if (result) {
alert("Found email: " + result[0]);
} else {
alert("No email found in the text.");
}
});
});
</script>
</head>
<body>
<div id="myText">Please contact us at support@example.com for assistance.</div>
<button id="extractButton">Extract Email</button>
</body>
</html>
इस उदाहरण में, जब बटन (#extractButton) पर क्लिक किया जाता है, तब #myText में मौजूद ईमेल एड्रेस का मिलान और एक्सट्रैक्शन किया जाता है और परिणाम अलर्ट बॉक्स में प्रदर्शित होता है।
Regex का उपयोग jQuery के साथ करके आप HTML तत्वों और उनके कंटेंट पर साधारण मिलान कार्यों को आसानी से कर सकते हैं। आप टेक्स्ट स्ट्रिंग्स में पैटर्न्स को सर्च और मिलान कर सकते हैं, विशेष कैरेक्टर्स का मिलान कर सकते हैं, और टेक्स्ट को एक्सट्रैक्ट कर सकते हैं। इन तकनीकों का उपयोग करके आप अपने वेब पेज को अधिक इंटरैक्टिव और प्रभावी बना सकते हैं।
Regex के साथ डेटा वेलिडेशन (Data Validation with Regex)
Regex (रेगुलर एक्सप्रेशन्स) का उपयोग डेटा वेलिडेशन के लिए व्यापक रूप से किया जाता है। यह आपको उपयोगकर्ता द्वारा दर्ज किए गए डेटा को एक विशेष पैटर्न के साथ मिलान करने की अनुमति देता है, जिससे यह सुनिश्चित होता है कि डेटा सही फॉर्मेट में है। jQuery के साथ Regex का उपयोग करके आप फॉर्म वेलिडेशन को आसानी से और प्रभावी ढंग से कर सकते हैं।
1. ईमेल वेलिडेशन (Email Validation)
ईमेल वेलिडेशन का उद्देश्य यह सुनिश्चित करना है कि उपयोगकर्ता द्वारा दर्ज किया गया ईमेल एड्रेस सही फॉर्मेट में है।
उदाहरण:
<!DOCTYPE html>
<html>
<head>
<title>Email Validation Example</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#validateEmailButton").click(function(){
var email = $("#emailInput").val();
// Regex का उपयोग करके ईमेल वेलिडेशन
var emailPattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
if (emailPattern.test(email)) {
alert("Valid email address!");
} else {
alert("Invalid email address. Please try again.");
}
});
});
</script>
</head>
<body>
<label for="emailInput">Email:</label>
<input type="text" id="emailInput">
<button id="validateEmailButton">Validate Email</button>
</body>
</html>
इस उदाहरण में, जब बटन (#validateEmailButton) पर क्लिक किया जाता है, तब #emailInput इनपुट का वैल्यू प्राप्त किया जाता है और Regex का उपयोग करके उसकी वेलिडिटी चेक की जाती है। अगर ईमेल सही फॉर्मेट में है, तो “Valid email address!” का संदेश प्रदर्शित होता है, अन्यथा “Invalid email address. Please try again.” का संदेश प्रदर्शित होता है।
2. फोन नंबर वेलिडेशन (Phone Number Validation)
फोन नंबर वेलिडेशन का उद्देश्य यह सुनिश्चित करना है कि उपयोगकर्ता द्वारा दर्ज किया गया फोन नंबर सही फॉर्मेट में है।
उदाहरण:
<!DOCTYPE html>
<html>
<head>
<title>Phone Number Validation Example</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#validatePhoneButton").click(function(){
var phoneNumber = $("#phoneInput").val();
// Regex का उपयोग करके फोन नंबर वेलिडेशन
var phonePattern = /^\d{10}$/;
if (phonePattern.test(phoneNumber)) {
alert("Valid phone number!");
} else {
alert("Invalid phone number. Please enter a 10-digit number.");
}
});
});
</script>
</head>
<body>
<label for="phoneInput">Phone Number:</label>
<input type="text" id="phoneInput">
<button id="validatePhoneButton">Validate Phone Number</button>
</body>
</html>
इस उदाहरण में, जब बटन (#validatePhoneButton) पर क्लिक किया जाता है, तब #phoneInput इनपुट का वैल्यू प्राप्त किया जाता है और Regex का उपयोग करके उसकी वेलिडिटी चेक की जाती है। अगर फोन नंबर सही फॉर्मेट में है, तो “Valid phone number!” का संदेश प्रदर्शित होता है, अन्यथा “Invalid phone number. Please enter a 10-digit number.” का संदेश प्रदर्शित होता है।
3. पासवर्ड वेलिडेशन (Password Validation)
पासवर्ड वेलिडेशन का उद्देश्य यह सुनिश्चित करना है कि उपयोगकर्ता द्वारा दर्ज किया गया पासवर्ड एक निश्चित सुरक्षा मानकों को पूरा करता है, जैसे कि लंबाई और कॉम्प्लेक्सिटी।
उदाहरण:
<!DOCTYPE html>
<html>
<head>
<title>Password Validation Example</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#validatePasswordButton").click(function(){
var password = $("#passwordInput").val();
// Regex का उपयोग करके पासवर्ड वेलिडेशन
var passwordPattern = /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,16}$/;
if (passwordPattern.test(password)) {
alert("Valid password!");
} else {
alert("Invalid password. Password must be 8-16 characters long and include at least one letter and one number.");
}
});
});
</script>
</head>
<body>
<label for="passwordInput">Password:</label>
<input type="password" id="passwordInput">
<button id="validatePasswordButton">Validate Password</button>
</body>
</html>
इस उदाहरण में, जब बटन (#validatePasswordButton) पर क्लिक किया जाता है, तब #passwordInput इनपुट का वैल्यू प्राप्त किया जाता है और Regex का उपयोग करके उसकी वेलिडिटी चेक की जाती है। अगर पासवर्ड सही फॉर्मेट में है, तो “Valid password!” का संदेश प्रदर्शित होता है, अन्यथा “Invalid password. Password must be 8-16 characters long and include at least one letter and one number.” का संदेश प्रदर्शित होता है।
4. URL वेलिडेशन (URL Validation)
URL वेलिडेशन का उद्देश्य यह सुनिश्चित करना है कि उपयोगकर्ता द्वारा दर्ज किया गया URL सही फॉर्मेट में है।
उदाहरण:
<!DOCTYPE html>
<html>
<head>
<title>URL Validation Example</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#validateUrlButton").click(function(){
var url = $("#urlInput").val();
// Regex का उपयोग करके URL वेलिडेशन
var urlPattern = /^(https?:\/\/)?([\da-z.-]+)\.([a-z.]{2,6})([\/\w .-]*)*\/?$/;
if (urlPattern.test(url)) {
alert("Valid URL!");
} else {
alert("Invalid URL. Please enter a valid URL.");
}
});
});
</script>
</head>
<body>
<label for="urlInput">URL:</label>
<input type="text" id="urlInput">
<button id="validateUrlButton">Validate URL</button>
</body>
</html>
इस उदाहरण में, जब बटन (#validateUrlButton) पर क्लिक किया जाता है, तब #urlInput इनपुट का वैल्यू प्राप्त किया जाता है और Regex का उपयोग करके उसकी वेलिडिटी चेक की जाती है। अगर URL सही फॉर्मेट में है, तो “Valid URL!” का संदेश प्रदर्शित होता है, अन्यथा “Invalid URL. Please enter a valid URL.” का संदेश प्रदर्शित होता है।