REKLAM ALANI

HTML5 Form Elementleri

avatar MerT Yılmaz
Aktif Üye
2237
#1
Yorumu Paylaş

HTML5 Yeni Form ElementleriHTML5 aşağıdaki yeni form elementlerine sahiptir:
  • <datalist>
  • <keygen>
  • <output>

NOT Tüm tarayıcılar yeni form elementlerini desteklemeyebilir. Ancak, yine de kullanabilirsiniz, sadece sıradan metin giriş alanı olarak davranacaklardır.



HTML5 <datalist> Elementi

<datalist> elementi, bir <input> elementi için önceden belirlenmiş bir dizi seçeneğin listesini belirtir.

<datalist> elementi <input> elementleri için bir "autocomplete" özelliği sağlar. Kullanıcılar, input verisi için önceden tanımlanmış bir açılır kutu listesi göreceklerdir.

Bir <datalist> elemanı ile birlikte bağlamak için <input> elemanının "list" özelliğini kullanın.


Bir <datalist> ile önceden değerleri belirlenmiş bir <input> elementi:



Kod:
<input list="browsers">

<datalist id="browsers">
  <option value="Internet Explorer">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>


HTML5 <keygen> Elementi

 <keygen> elementinin amacı, kullanıcıları yetkilendirmek için güvenli bir yol kullanmaktır.
 
<keygen> etiketi, bir form içerisinde bir anahtar çifti (key-pair) jeneratörü belirtir.
 
Form gönderildiğinde, iki anahtar oluşturulur, biri özel biri ise genel.
 
Özel anahtar sizin lokalinizde saklanır, genel olanı ise sunucuya gönderilir. Genel anahtar, kullanıcının ileride tekrar kullanabilmesi için bir istemci sertifikası oluşturmak için kullanılır.


Keygen alanı olan bir form:


 
Kod:
<form action="demo_keygen.php" method="get">
Kullanıcı adı: <input type="text" name="usr_name">
Şifreleme: <keygen name="security">
<input type="submit">
</form>
 

HTML5 <output> Elementi


<output> elementi bir hesaplamanın sonucunu gösterir (bir script gibi)


Bir hesaplama yapmak ve sonucu <output> elementi içinde göstermek:

 
Kod:
<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
<input type="range" id="a" value="50">100 +
<input type="number" id="b" value="50">=
<output name="x" for="a b"></output>
</form>
deneme
Aktif Üye

Konuda Ara

2 Yorum

FewerTheMadBağışçı

Aktif Üye

Aktif Üye
avatar
FewerTheMadBağışçı
16-02-2021, Saat: 10:25
16-02-2021, Saat: 10:25
#2
Yorumu Paylaş
Teşekkürler.

serhat2110

Aktif Üye

Aktif Üye
avatar
serhat2110
16-02-2021, Saat: 10:54
16-02-2021, Saat: 10:54
#3
Yorumu Paylaş
teşekkürler


Konuyu Okuyanlar: