Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> JavaScript

HTML में JavaScript के साथ सर्च बॉक्स में डिफ़ॉल्ट सर्च टेक्स्ट कैसे जोड़ें?

आप प्लेसहोल्डर की अवधारणा का उपयोग कर सकते हैं। JavaScript कोड निम्न है:

उदाहरण

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> </head> <body> <input type="text" id="textSearch" placeholder="Search the value" /> <script>    var yourText= "John";    var textBoxSearch = document.getElementById("textSearch");    textBoxSearch.value = yourText;    textBoxSearch.onfocus = function() {       if (this.value == yourText) {          this.value = '';       }    } </script> </body> </html>

उपरोक्त प्रोग्राम चलाने के लिए, फाइल का नाम anyName.html(index.html) सेव करें और फाइल पर राइट-क्लिक करके VS कोड एडिटर में "Open with Live Server" विकल्प चुनें।

आउटपुट

HTML में JavaScript के साथ सर्च बॉक्स में डिफ़ॉल्ट सर्च टेक्स्ट कैसे जोड़ें?

जब आप सर्च बॉक्स पर क्लिक करते हैं, तो प्लेसहोल्डर वैल्यू दिखाई देगी:

HTML में JavaScript के साथ सर्च बॉक्स में डिफ़ॉल्ट सर्च टेक्स्ट कैसे जोड़ें?

  1. JavaScript से <strong> टैग में टेक्स्ट कैसे सेट करें? JavaScript से <strong> टैग में टेक्स्ट कैसे सेट करें?

    उदाहरण सबसे पहले <strong> एलिमेंट सेट करें: <strong id=strongDemo>Replace This strong tag</strong> आईडी का उपयोग करके jQuery से टेक्स्ट सेट करें: $(document).ready(function(){ $(#strongDemo).html(Actual value of 5+10 is 15.....); }); पूरा HTML कोड: <!DOCTYPE html> <

  1. JavaScript के साथ innerHTML सेट करें JavaScript के साथ innerHTML सेट करें

    innerHTML सेट करने का सही सिंटैक्स निम्नानुसार है - document.getElementById(yourIdName).innerHTML=yourValue; आइए अब देखें कि innerHTML कैसे सेट करें - उदाहरण <!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8> <meta name=viewport content=width=device-widt

  1. JavaScript में टेक्स्टबॉक्स का मान कैसे प्रदर्शित करें JavaScript में टेक्स्टबॉक्स का मान कैसे प्रदर्शित करें

    टेक्स्ट बॉक्स से मान निकालने के लिए value का उपयोग करें और पैराग्राफ में innerHTML से प्रदर्शित करें।उदाहरणकोड निम्न है:<!DOCTYPE html> <html lang=en> <head>    <meta charset=UTF-8>    <meta name=viewport content=width=device-width, initial-scale=1.0>