Forum Mjukvara Programmering och digitalt skapande Tråd

Javascript, textfält och byta ut värden

1
Skriv svar
Permalänk
Medlem
●

Javascript, textfält och byta ut värden

Halloj.
Hoppas nån kan hjälpa mig lösa mitt problem, har försökt googlat med vet inte riktigt vad jag ska söka på för att hitta en lösning på det jag söker.

Skulle vilja ha 5st textrutor knuta till variablerna:
fornamn, efternamn, alder, adress och stad.

Sen vill jag ha en större textruta enligt följande:
Hej Jag heter $fornamn $efternamn och är $alder år gammal.
Jag bor på adressern $adress i $stad.

Efter det att man fyllt i informationen de 5 små textrutorna så skall man kunna klicka på en knapp som sedan genererar texten i textrutan med informationen ifrån dessa.

Va inne på att köra replace, men det verkar bara funka för en förekomst av det ordet som skall replace:as så har man "Mitt namn är fornamn fornamn" så blir resultatet "Mitt namn är Berra fornamn".

Jag hoppas nån vänlig själ kan hjälpa mig eller åtminstone peka till någon bra sida som förklara hur man kan lösa problemet.

Tack på förhand.

mvh milkacid

Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av milkacid:

Va inne på att köra replace, men det verkar bara funka för en förekomst av det ordet som skall replace:as så har man "Mitt namn är fornamn fornamn" så blir resultatet "Mitt namn är Berra fornamn".

Gå till inlägget

Ang detta så fungerar det nog bättre om du gör på liknande sätt.

Variablerna bör helst vara inom + så att det kan se ut såhär.
Nu är jag absolut inget proffs på Javascript men det är vad tror att jag kommer ihåg i alla fall.

"Mitt namn är " + fornamn + " " + efternamn + " jag är " + alder + " år gammal." osv osv

Kan ha jättefel också, har jag fel får någon gärna rätta mig så jag inte lurar grabben här.

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

Replace stödjer att byta ut fler än ett fält, det du måste tänka på att replace vill ha en regular expression. Det du måste tänka på dock är att berätta att du vill matcha alla förekommande, det gör du med 'g'

someString = 'some $name duude $name oh and $name again.';
newstr = someString.replace(/\$name/g, 'duude')

https://developer.mozilla.org/en-US/docs/JavaScript/Reference...

Visa signatur

Speldator: Ryzen 7800X3D, 64GB DDR5, RTX 5090
Server: i7-8700k, 32GB DDR4, RTX2080
Steam deck, Rog Ally + de fiesta konsoler.

Redigera
Citera flera Citera
Permalänk
Medlem
●

Inte så vackert, speciellt inte html-koden, men visar en lösning:
http://jsfiddle.net/DPxXa/

Redigera
Citera flera Citera
Permalänk
Medlem
●

grejade lite med Yxskafet's kod och det ser väl kanske bara lite bättre ut, lånade lite från webben också, men det som du vill ha svar på finns väl i koden..

EDIT: med "ser lite bättre ut" menar ja absolut inte koden

<label for="myTextBox1">
<p> Förnamn:</label></p>
<input type="text" id="name" />

<p> Efternamn:</label></p>
<input type="text" id="surname" />

<p>Ålder:</label></p>
<input type="text" id="age" />

<p>Gata:</label></p>
<input type="text" id="street" />

<p>Stad:</label></p>
<input type="text" id="city" />

<input type="button" id="submit" value="submit"/>
<p id="result"></p>
​

Dold text

$('#submit').click(function(){
$('#result').empty().html(
'Hej, jag heter ' + $('#name').val() + ' ' + $('#surname').val() + ' och är ' +
$('#age').val() + ' år gammal. Jag bor på ' + $('#street').val() + ' i ' + $('#city').val()
);
});
​

Dold text

Lite problem med länken först, men nu tror ja det är rätt!
http://jsfiddle.net/DPxXa/3/

Senast redigerat
Redigera
Citera flera Citera
1
Skriv svar