Warning: Declaration of TarskiCommentWalker::start_lvl(&$output, $depth, $args) should be compatible with Walker_Comment::start_lvl(&$output, $depth = 0, $args = Array) in /home/blacklab/domains/wersjatestowa.eu/public_html/wp-content/themes/tarski/library/classes/comment_walker.php on line 0

Warning: Declaration of TarskiCommentWalker::start_el(&$output, $comment, $depth, $args) should be compatible with Walker_Comment::start_el(&$output, $comment, $depth = 0, $args = Array, $id = 0) in /home/blacklab/domains/wersjatestowa.eu/public_html/wp-content/themes/tarski/library/classes/comment_walker.php on line 0
Pole tekstowe dynamicznie zwiększające swój rozmiar [HTML/JS] | WersjaTestowa.eu

Pole tekstowe dynamicznie zwiększające swój rozmiar [HTML/JS]


Warning: Use of undefined constant ga_strikable_before_myoption - assumed 'ga_strikable_before_myoption' (this will throw an Error in a future version of PHP) in /home/blacklab/domains/wersjatestowa.eu/public_html/wp-content/plugins/simplest-adsense-ads-manager/simplest-adsense-ads-manager.php on line 228

Warning: Use of undefined constant ga_strikable_mid_para_value - assumed 'ga_strikable_mid_para_value' (this will throw an Error in a future version of PHP) in /home/blacklab/domains/wersjatestowa.eu/public_html/wp-content/plugins/simplest-adsense-ads-manager/simplest-adsense-ads-manager.php on line 178

Warning: Use of undefined constant ga_strikable_mid_myoption - assumed 'ga_strikable_mid_myoption' (this will throw an Error in a future version of PHP) in /home/blacklab/domains/wersjatestowa.eu/public_html/wp-content/plugins/simplest-adsense-ads-manager/simplest-adsense-ads-manager.php on line 183

Warning: Use of undefined constant ga_strikable_after_myoption - assumed 'ga_strikable_after_myoption' (this will throw an Error in a future version of PHP) in /home/blacklab/domains/wersjatestowa.eu/public_html/wp-content/plugins/simplest-adsense-ads-manager/simplest-adsense-ads-manager.php on line 257

pole tekstowe zmieniające swój rozmiar w zależności od ilości tekstu

Przykład dynamicznie rozszerzającego się pola tekstowego w formularzu

Pokrótce jaki jest problem: Mamy pole tekstowe w HTML typu <input type=”text”> domyślnie ma swój rozmiar jaki ma. W zależności od ilości danych, czasem ten rozmiar wystarcza, a czasem pojawiają się dłuższe ciągi znaków które powodują to, że pole tekstowe jest za małe na tekst użytkownik musi przewijać kursorem żeby przeczytać go w całości. Nie jest to zbyt użyteczne, a określenie maksymalnej ilości znaków w polu też nie jest do końca wyjściem.

Rozwiązaniem problemu będzie dynamicznie rozszerzające się pole tekstowe. Jak to zrobić?

W pliku gdzie chcemy zastosować ten efekt dodajemy taki oto skrypt:

 

<script type="text/javascript">
/*<![CDATA[*/
function Rozszerz(obj){
 if (!obj.savesize) obj.savesize=obj.size;
 obj.size=Math.max(obj.savesize,obj.value.length);
}
/*]]>*/
</script>

a następnie dodajemy do pola tekstowego które ma mieć właściwość rozszerzania:

  <input type="text" onkeyup="Rozszerz(this);"/>

I gotowe! Oczywiście nasze pole tekstowe może mieć szereg innych właściwości.

Tags: ,

Reply

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *