2010-11-18 14 views
7

जावास्क्रिप्ट फ़ंक्शन द्वारा HTML टेक्स्टबॉक्स तक कैसे पहुंचे?जावास्क्रिप्ट से एक HTML टेक्स्टबॉक्स तक कैसे पहुंचे?

+0

क्या आपका मतलब है, टेक्स्ट बॉक्स का मूल्य प्राप्त करने के लिए? –

+0

हां बिल्कुल। सर्वर पर वापस जाने के बिना –

+0

[पहले थ्रेड में अधिक तरीके] [http://stackoverflow.com/questions/4206336/how-do-i-use-javascript-to-update-the-values-of-hidden- इनपुट-फ़ील्ड/420645 9 # 420645 9) – Tobias

उत्तर

9

सेट और प्रयोग document.getElementById() फ़ंक्शन ... उदाहरण नीचे:

<html> 
<head> 
<script type="text/javascript"> 

function doSomethingWithTextBox() 
{ 
    var textBox = document.getElementById('TEXTBOX_ID'); 
    // do something with it ... 

} 

</script> 
</head> 

<body> 

<input type="text" id="TEXTBOX_ID"> 

</body> 
</html> 
+4

संक्षेप में, यह वास्तव में टेक्स्टबॉक्स (TEXTBOX_ID) का मान नहीं प्राप्त करेगा जबतक कि आप फ़ंक्शन को कुछ नहीं करते हैं। WithethingWithTextBox()। आपको अपने इनपुट टैग (TEXTBOX_ID) के बाद फ़ंक्शन doSomethingWithTextBox() को कॉल करने की आवश्यकता होगी अन्यथा doSomethingWithTextBox() एक टेक्स्टबॉक्स की तलाश करेगा जो अभी तक मौजूद नहीं है, और आपको एक त्रुटि मिलती है। –

4

document.getElementById ('textboxid')। मूल्य या document.formname.textboxname.value

5

अपने पाठ बॉक्स एक id विशेषता दो, और बाद document.getElementById('<textbox id>') के साथ लाने। पाठ बॉक्स पर आईडी संपत्ति

5

सबसे पहले आप एक डोम (दस्तावेज़ ऑब्जेक्ट मॉडल) प्राप्त करने में सक्षम होने की जरूरत है पाठ बॉक्स के संदर्भ में :

<input type="text" id="mytextbox" value="Hello World!" /> 

सूचना id विशेषता, पाठ बॉक्स अब आईडी mytextbox है।

अगला चरण जावास्क्रिप्ट में संदर्भ प्राप्त करने के लिए है:

var textbox = document.getElementById('mytextbox'); // assign the DOM element reference to the variable "textbox" 

यह अपने id विशेषता के आधार पर एक HTML तत्व प्राप्त हो सकें। ध्यान दें कि उन आईडी की अद्वितीय होने की आवश्यकता है, इसलिए आपके पास एक ही आईडी के साथ दो टेक्स्टबॉक्स नहीं हो सकते हैं।

अब अंतिम चरण पाठ बॉक्स के मान प्राप्त करने के लिए है:

alert(textbox.value); // alert the contents of the textbox to the user 

value संपत्ति पाठ बॉक्स की सामग्री शामिल है, और बस हो गया!

अधिक संदर्भ के लिए आप बाहर MDC पर कुछ सामान से अधिक जांच करना चाह सकते:
GetElementByID Reference
Input Element Reference
A general overview of the DOM

6

बहुत बस, इस प्रयास करें:

<!doctype html> 
<html> 
    <head> 
     … 
    </head> 
<body> 
    <form> 
     <input id="textbox" type="text" /> 
    </form> 
    <script> 
     var textboxValue = document.getElementById("textbox").value; 
    </script> 
</body> 

परिवर्तनीय textboxValue बराबर होगा wha tever आपने टेक्स्टबॉक्स में टाइप किया है।

याद रखें कि आपको अपनी स्क्रिप्ट को रखना होगा, यदि टेक्स्ट HTML (input फ़ील्ड) आपके HTML में दिखाई देता है, अन्यथा जब पृष्ठ पहले लोड होता है तो आपको एक त्रुटि मिल जाएगी, क्योंकि स्क्रिप्ट input की तलाश में है फ़ील्ड जो अभी तक ब्राउज़र द्वारा नहीं बनाई गई है।

मुझे आशा है कि इससे मदद मिलती है!

संबंधित मुद्दे