8 svar · 490 visningar · startad av web00132
Jag använder följande kod (har strippat bort oväsentligheter):
<form id="registerform">
<p>
<label>
Username<br />
<input type="text" id="user_login" />
</label>
</p>
</form>
Nu skulle jag, mha JavaScript, vilja hitta ordet 'Username' och byta ut det mot 'Full name'. Hur ska jag för det första gå tillväga för att hitta ordet i just den HTML-taggen, och för det andra byta ut det ordet?
Observera, jag har inte möjlighet att ändra direkt i HTML-koden alltså. Tackar på förhand!
Uppdatering: Jag lyckas gömma texten genom att använda lite CSS...
#registerform p:first-child label {
visibility: hidden !important;
}
#registerform p:first-child label input {
visibility: visible !important;
}
Men hur får jag dit en annan text?
Tanke: Öka på margin-top och lägg en bakgrundsbild innehållande texten, med no-repeat.
Ingen dum tanke nitro2k01, men om jag hellre skulle göra det med javascript, hur skulle man i såna fall göra?
Så här:
window.onload=function(){
var container = document.getElementById('user_login').parentNode;
var textel = container.firstChild;
container.replaceChild(document.createTextNode('Full Name'), textel);
}
Med reservation för att koden inte funkar i IE.
Men säg mig, varför kan du inte komma åt att redigera HTML-koden?
Quick 'n dirty find & replace:
function findAndReplace(element, needle, substitution) {
var h = element.innerHTML;
h = h.replace(new RegExp(needle, "ig"), substitution);
element.innerHTML = h;
}
Användning:
var elems = document.getElementsByTagName("label");
var needle = "Username";
var subst = "Full name";
findAndReplace(elems[0], needle, subst);
Nitro! Din kod funkar prima! Även i IE8 verkar det som, har inte möjlighet att testa tidigare versioner.
Anledningen är att jag försöker ändra en Wordpress-inloggningssida, och jag vill inte in i WP-"kärnan" och pilla för då blir det meckigt att uppgradera till kommande versioner sen.
SPiN: Får inte din kod att funka, men det ser ju riktigt snajdig ut och kanske är bättre kompatibilitetsmässigt?
Stort tack för era svar i alla fall! :bire
Aj då! Javascriptet inkluderas för flera formulär och ibland ska det stå 'Username' och ibland inte. Går det att på något sätt kolla om formuläret som den där label-taggen ligger inom har id='registerform'?
Typ:
window.onload=function(){
var container = document.getElementById('user_login').parentNode;
[B]var parentForm = container.parentNode.Id[/B]
var textel = container.firstChild;
[B]if (parentForm == 'registerform') {[/B]
container.replaceChild(document.createTextNode('Full Name'), textel);
[B]}[/B]
}
Den koden funkar alltså inte, men går det att fixa nåt liknande?
var parentForm = container.parentNode.getAttribute('id');
...