2012-11-22 13 views
44

Wie kann ich den Platzhaltertext eines Eingabeelements ändern?Platzhaltertext ändern

Zum Beispiel habe ich 3 Eingänge des Typs Text.

<input type="text" name="Email" placeholder="Some Text"> 
<input type="text" name="First Name" placeholder="Some Text"> 
<input type="text" name="Last Name"placeholder="Some Text"> 

Wie kann ich die etwas Text Text mit JavaScript oder jQuery ändern? Ich muss wirklich herausfinden, um mein Problem zu lösen.

+8

Haben Sie '$ ('input') versucht. Attr ('Platzhalter', 'Etwas neuer Text');'? – Jeemusu

+1

Haben Sie irgendwas mit Javascript oder jquery probiert? Bitte posten Sie, was Sie versucht haben und mit welchen Problemen Sie konfrontiert wurden. – ryadavilli

+0

Sie können Malarkey verwenden –

Antwort

87

Sie getElementsByName() verwenden können Verfahren die input Felder auszuwählen und die placeholder für jeden ... siehe den unten Code zu ändern ...

document.getElementsByName('Email')[0].placeholder='new text for email'; 
document.getElementsByName('First Name')[0].placeholder='new text for fname'; 
document.getElementsByName('Last Name')[0].placeholder='new text for lname'; 
+21

+1 für native gehen ohne externe Bibliotheken ... Menschen müssen auf die DOM-APIs achten Sie müssen möglicherweise nicht eine ganze Bibliothek verwenden, nur um etwas so einfach zu tun. –

+0

Oft enthält das Feld bereits einen Wert, daher ist der Platzhalter nicht sichtbar. Sie müssen den Wert löschen. 'var email = document.getElementsByName ("E-Mail") [0];' ' email.value = '';' ' email.placeholder = 'neuer Text für E-Mail',' – askrynnikov

4

mit JQuery können Sie dies tun, indem Sie folgenden Code ein:

<input type="text" id="tbxEmail" name="Email" placeholder="Some Text"/> 

$('#tbxEmail').attr('placeholder','Some New Text'); 
25

Diese Lösung jQuery verwendet. Wenn Sie denselben Platzhalter-Text für alle Texteingaben verwenden möchten, können Sie

$('input:text').attr('placeholder','Some New Text'); 

verwenden Und wenn Sie verschiedene Platzhalter wollen, können Sie das Element die ID verwenden, um Platzhalter zu ändern

$('#element1_id').attr('placeholder','Some New Text 1'); 
$('#element2_id').attr('placeholder','Some New Text 2'); 
+0

JA !!! das funktioniert! – visual

4

ich habe f worden das gleiche Problem.

In JS müssen Sie zuerst das Textfeld der Texteingabe löschen. Andernfalls wird der Platzhaltertext nicht angezeigt.

Hier ist meine Lösung.

document.getElementsByName("email")[0].value=""; 
document.getElementsByName("email")[0].placeholder="your message"; 
+0

Das ist richtig. Ohne das Feld zuerst leer zu setzen, wird der Platzhalter nicht angezeigt. Verbrachte lange Zeit damit, bis ich auf diesen Posten stieß. – User12345

0

Versuchen Sie den Platzhalter Attribut des Eingangs Zugriff und seinen Wert wie folgt ändern:

$('#some_input_id').attr('placeholder','New Text Here'); 

Kann auch klar der Platzhalter bei Bedarf wie:

$('#some_input_id').attr('placeholder',''); 
Verwandte Themen