input - Kurs HTML i CSS
Indeks, wyszukiwarka / Skrypt indeksu, wyszukiwarki...{ document.write( '<form id="' + this.id + '" action="javascript:void(0)" onsubmit="' + this.id + '.wyswietl(); return false">' + '<input type="text" name="haslo" size="30" onkeyup="' + this.id + '.zaznacz()" class="text">' + '<div><select name="hasla" size="' + (typeof rozmiar != 'undefined' && rozmiar ? rozmiar : 15) + '" ondblclick="' + this.id + '.wyswietl()">' ); for (var i = 0; i < hasla.length; i++) { document.write('<option value="' + ((typeof...
HTML5 / Nowe elementy HTML5Spis treści Wstęp Sekcje Nagłówki sekcji Znaczniki grupujące Semantyka tekstu Elementy osadzone Formularze Pole INPUT Elementy interaktywne Skrypty Wstęp Standard HTML5 nie jest już taki nowy, ale nadal mogą być do niego wprowadzane nowe znaczniki. Przeglądarki które ich jeszcze nie odsługują, zwykle próbują wyświetlać je w linii. Nie jest to zgodne z domyślnym sposobem prezentacji części z tych elementów określonym w specyfikacji. Aby ujednolicić sposób wyświetlania...
- Komendy HTML 4.01 / Zdarzenia
...Skrypty są często używane w połączeniu z formularzami, których kontrolki (pola) służą do wprowadzania danych i wyprowadzania wyników. Przykład <input onclick> Po wpisaniu: <input type="button" value="Kliknij tutaj!" onclick="window.alert('To jest właśnie obsługa zdarzenia, jakim było kliknięcie myszką na przycisku.')"> Otrzymamy: Jak widać aby obsłużyć zdarzenie, należy podać w składni polecenia, czynności które mają zostać wykonane. Najczęściej stosuje się tutaj odwołanie do funkcji...
Selektory pseudoklas CSS / Zaznaczenie :checked...które użytkownik zaznaczył. Zaznaczenie dla opcji listy rozwijalnej obsługuje tylko Firefox. Przykład :checked Po wpisaniu w arkuszu stylów: input:checked, option:checked { margin-left: 30px } a w dowolnym miejscu strony: <form action="?"> <fieldset> <input type="radio" checked name="pole_opcji"> <input type="radio" name="pole_opcji"> </fieldset> <fieldset> <input type="checkbox" checked> <input type="checkbox"> </fieldset> <select size="3"> <option selected>Opcja...
- Wyszukiwarka / Wyszukiwanie tylko w polskim Internecie
<form action="https://www.google.pl/search" method="get"> <input type="text" name="q"> <input type="hidden" name="ie" value="utf-8"> <input type="hidden" name="lr" value="lang_pl"> <input type="submit" value="Szukaj"> </form> Przykład
- HTML5 / Zdarzenia HTML5
...blur onblur Elementy, Window Uruchamia się na węzłach, gdy przestają być one fokusowane. cancel oncancel Elementy CloseWatcher, dialog, input Uruchamia się na obiektach CloseWatcher lub elementach dialog, gdy otrzymują żądanie zamknięcia, lub na elementach input, gdy nie dokonano zmiany wyboru pliku. change onchange Elementy formularza Uruchamia się, gdy użytkownik zmienia wartość formularza (patrz również zdarzenie input). click onclick Elementy Normalnie jest to...
- Wyszukiwarka / Wyszukiwanie w podanym serwisie
<form action="https://www.google.pl/search" method="get"> <input type="text" name="q"> <input type="hidden" name="ie" value="utf-8"> <input type="hidden" name="sitesearch" value="domena"> <input type="submit" value="Szukaj"> </form> gdzie jako "domena" należy wpisać adres strony, np. www.google.pl. Wyszukiwanie stron z Twojego serwisu może być niemożliwe jeśli nie posiadasz domeny lub subdomeny! Ponadto należy pamiętać, że aby przeszukiwanie serwisu mogło się odbyć, najpierw należy...
- Selektory pseudoklas CSS / Blokada :disabled :enabled
...Pole odblokowane to natomiast takie, które nie posiada atrybutu disabled (domyślnie). Przykład :disabled :enabled Po wpisaniu w arkuszu stylów: input:disabled { border: 1px solid blue } input:enabled { border: 1px solid red } a w dowolnym miejscu strony: <form action="?"> <input type="text" value="Zablokowane" disabled> <input type="text" value="Odblokowane"> </form> otrzymamy dwie tekstowe kontrolki formularza - pierwsza z niebieskim obramowaniem (zablokowana), a druga z czerwonym...
- Selektory pseudoklas CSS / Tylko do odczytu :read-only :read-write
...ważnym może okazać się graficzne wyróżnienie za pomocą CSS pól tylko do odczytu. Przykład :read-only :read-write Po wpisaniu w arkuszu stylów: input:read-only { border: 1px solid blue } input:read-write { border: 1px solid red } a w dowolnym miejscu strony: <form action="?"> <input type="text" value="Tylko do odczytu" readonly> <input type="text" value="Do odczytu i do zapisu"> </form> otrzymamy dwie tekstowe kontrolki formularza - pierwsza z niebieskim obramowaniem (zablokowana), a...
- HTML5 / Autouzupełnianie <datalist>
(interpretuje: Internet Explorer 10, Firefox 4, Opera 10, Chrome 20) <input list="identyfikator"> <datalist id="identyfikator"> <option value="wartość1"> <option value="wartość2"> ... </datalist> Większość przeglądarek posiada funkcję tzw. autouzupełniania elementów formularzy. Jeżeli użytkownik wpisze coś w formularzu, a potem go wyśle, to kiedy będzie następnym razem wypełniał ten sam formularz, przeglądarka wyświetli mu podpowiedzi w postaci wartości, które wcześniej wpisywał w...