जब मैं फ़ील्ड में प्रवेश करता हूं तो गायब होने के लिए फॉर्म वैल्यू कैसे प्राप्त करूं?

Question

मैं लगभग आठ इनपुट फ़ील्ड के साथ एक साधारण रूप बना रहा हूं। मैं क्षेत्र में प्रारंभिक मूल्य यह इंगित करना चाहता हूं कि लोगों को क्या दर्ज करना है। उदाहरण के लिए मूल्य = "नाम" ताकि लोग वहां नाम दर्ज करने के बारे में जान सकें।

मेरा प्रश्न यह है कि जब आप उस फ़ील्ड में प्रवेश करते हैं तो प्रारंभिक मान को गायब करने के लिए कैसे मिलता है ताकि प्रारंभिक मान केवल एक संकेत है और स्थायी मूल्य नहीं है जिसे वे अपना नाम टाइप करने से पहले मिटाना चाहते हैं?

धन्यवाद!

Answer 1

"डिफ़ॉल्ट" मान को "नाम" पर सेट करें। फिर, जावास्क्रिप्ट और 'ऑनफोकस' ईवेंट का उपयोग करके, फ़ील्ड को साफ़ करें।

तो तुम होगा:

<input type="textbox" value="Name" onfocus="if (this.value=='Name') this.value='';"/> 

Answer 2

बेसिक जावास्क्रिप्ट:

<input type="text" value="name" onfocus='if(this.value=="name"){this.value="";}' /> 

Answer 3

यह आप इसे कैसे करना चाहिए है।

<input type="text" value="name" onfocus="this.value = this.value=='name'?'':this.value;" onblur="this.value = this.value==''?'name':this.value;"> 

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

Answer 4

एक बहुत ही आसान तरीका संभवतः हो सकता है:

placeholder="Name" 

Answer 5

बस एस & जी की मैंने सोचा कि मैं इस समस्या के लिए एक पुन: प्रयोज्य jQuery समाधान पोस्ट करेंगे।

var formDefaulter=function(){ 
    //Class to hold each form element 
    var FormElement=function(element){ 
     var that=this; 
     this.element=element; 

     var initialVal=this.element.val(); 
     var isEdited=false; 

     this.element.focus(function(){clearBox()}); 
     this.element.blur(function(){fillBox()}); 

     var clearBox=function(){ 
      if(!isEdited){ 
       that.element.val(""); 
       isEdited=true; 
      } 
     } 
     var fillBox=function(){ 
      if(that.element.val()==""){ 
       that.element.val(initialVal); 
       isEdited=false; 
      } 
     } 
    } 

    var add=function(elementId){ 
     new FormElement($('#'+elementId)); 
    } 

    return{ 
     add:add 
    } 
}(); 

फिर आपको केवल आईडी विशेषता मान का उपयोग करके प्रत्येक तत्व को संलग्न करना होगा। इस तरह:

$(function(){ 
    formDefaulter.add('contact_name'); 
    formDefaulter.add('contact_email'); 
    formDefaulter.add('contact_msg'); 
}); 

यह सामग्री तत्व को हटाए जाने पर इसके मूल मान के साथ फ़ॉर्म तत्व को भी भर देता है। वैसे भी, उम्मीद है कि यह किसी के लिए सहायक है।