Forum PHP.pl > [JavaScript][PHP][HTML][Inne] skrypt html (czyt opis)

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [JavaScript][PHP][HTML][Inne] skrypt html (czyt opis)

Neeew

28.04.2013, 20:34:25

tak jak w opisie...
chcialbym zrobic pole ktore jak sie wpisze do pierwszego pola tekst to w drugim polu pojawi sie odwrócony tekst...

a tu skrypt jak ma wygladac...

[HTML] pobierz, plaintext 
<html>
 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>  
<title>Strona odwracająca tekst</title>
</head>
 
<u><h1>Odwracanie tekstu</h1></u>
 
<!--Pole Formularza + przycisk-->
<input type="text" maxlength="99999" size="30">
<input type="submit" value="Odwróć!"/>
 
<hr color="black">
 
<h3>Odwrócony tekst:<h3>
 
<!--Pole z odpowiedzia-->
<textarea placeholder="rezultaty odwrócenia..."></textarea>
 
<hr color="black">
<center><b>?Strona stworzona na potrzeby forum.php.pl</b></center>  
<body bgcolor="green">
</body>
 
</html>
[HTML] pobierz, plaintext

prosze o pomoc... przyda mi sie taki skrypt.

który odwróci tekst np Hello World! = !dlroW olleH .

lobopol

28.04.2013, 21:25:23

Wyciągasz wartość inputa, używasz na nim split i robisz prostą pętle na uzyskanej tablicy idąc od tyłu, wartość wpisujesz do textarea

Albo prościej

[JAVASCRIPT] pobierz, plaintext 
var result = string.split("").reverse().join("");
[JAVASCRIPT] pobierz, plaintext

gdzie string to pobrana wartość inputa

Neeew

28.04.2013, 21:52:08

hmm nie umiem... da sie jakoś łatwiej wytlumaczyc? :/ , thx.

PrinceOfPersia

28.04.2013, 23:53:46

po prostu wstaw podany wyżej kod do funkcji, która będzie odpalana jak ktoś kliknie. Np. tak: (wersja z użyciem jQuery):

[JAVASCRIPT] pobierz, plaintext 
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$(document).ready(function() { 
     $("#odwroc").click(function() {
        var oryginalnyTekst = $("#okienko-do-wpisywania").val(); // pobieramy atrybut "value" z inputa "okienko-do-wpisywania"
        var odwroconyTekst = oryginalnyTekst.split("").reverse().join("");  // "sztuczka" do zamieniania tekstu
        $("#rezultaty").text(odwroconyTekst); // zrzucamy tekst do elementu o id "rezultaty"
     });
});
</script>
[JAVASCRIPT] pobierz, plaintext

Tylko, żeby to zadziało, musisz dodać odpowiednie id:
<input id="okienko-do-wpisywania" type="text" maxlength="99999" size="30">
<input id="odwroc" type="submit" value="Odwró?!"/>
<textarea id="rezultaty" placeholder="rezultaty odwrócenia..."></textarea>

Neeew

29.04.2013, 04:32:05

[HTML] pobierz, plaintext 
<html>
 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>  
<title>Strona odwracająca tekst</title>
</head>
 
<u><h1>Odwracanie tekstu</h1></u>
 
<!--Pole Formularza + przycisk-->
<input type="text" id="okienko-do-wpisywania" maxlength="9999999" size="30">
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
 
<script>
$(document).ready(function() { 
 
     $("#odwroc").click(function() {
 
        var oryginalnyTekst = $("#okienko-do-wpisywania").val(); // pobieramy atrybut "value" z inputa "okienko-do-wpisywania"
 
        var odwroconyTekst = oryginalnyTekst.split("").reverse().join("");  // "sztuczka" do zamieniania tekstu
 
        $("#rezultaty").text(odwroconyTekst); // zrzucamy tekst do elementu o id "rezultaty"
 
     });
 
});
 
</script> 
<input type="submit" id="odwroc" value="Odwróć!"/>
 
<hr color="black">
 
<h3>Odwrócony tekst:<h3>
 
<!--Pole z odpowiedzia-->
<textarea id="rezultaty" placeholder="rezultaty odwrócenia..."></textarea>
 
<hr color="black">
<center><b>&copy;Strona stworzona na potrzeby forum.php.pl</b></center>  
<body bgcolor="green">
</body>
 
</html>
[HTML] pobierz, plaintext

działa, dzięki

|| temat mozna zamknac.

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.