HTML <input> kalıbı Özellik
Örnek
Yalnızca üç harf içerebilen (sayı veya özel karakter içermeyen) giriş alanına sahip bir HTML formu:
<form action="/action_page.php">
<label for="country_code">Country code:</label>
<input
type="text" id="country_code" name="country_code"
pattern="[A-Za-z]{3}"
title="Three letter country code"><br><br>
<input type="submit">
</form>
Aşağıda daha fazla "Kendiniz Deneyin" örnekleri.
Tanım ve Kullanım
Nitelik , form gönderiminde öğenin değerinin kontrol pattern
edildiği düzenli bir ifadeyi belirtir .
<input>
Not: Özellik pattern
şu giriş türleriyle çalışır: metin, tarih, arama, url, tel, e-posta ve parola.
İpucu:title
Kullanıcıya yardımcı olmak için kalıbı tanımlamak için global özniteliği kullanın .
İpucu: JavaScript eğitimimizde normal ifadeler hakkında daha fazla bilgi edinin .
Tarayıcı Desteği
Tablodaki sayılar, özelliği tam olarak destekleyen ilk tarayıcı sürümünü belirtir.
Attribute | |||||
---|---|---|---|---|---|
pattern | 5.0 | 10.0 | 4.0 | 10.1 | 9.6 |
Sözdizimi
<input pattern="regexp">
Özellik Değerleri
Value | Description |
---|---|
regexp | Specifies a regular expression that the <input> element's value is checked against |
Daha fazla örnek
Örnek
8 veya daha fazla karakter içermesi gereken type="password" içeren bir <input> öğesi:
<form action="/action_page.php">
<label for="pwd">Password:</label>
<input type="password" id="pwd"
name="pwd"
pattern=".{8,}" title="Eight or more characters">
<input type="submit">
</form>
Örnek
En az bir sayıdan ve bir büyük ve küçük harften oluşan 8 veya daha fazla karakter içermesi gereken type="password" içeren bir <input> öğesi:
<form action="/action_page.php">
<label for="pwd">Password:</label>
<input type="password" id="pwd" name="pwd"
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}"
title="Must contain at least one number and one uppercase and lowercase letter, and at least 8 or more characters">
<input type="submit">
</form>
Örnek
Aşağıdaki sırada olması gereken type="email" içeren bir <input> öğesi: karakter @ karakter . etki alanı (karakterlerin ardından bir @ işareti, ardından daha fazla karakter ve ardından bir "."
Sonra "." a'dan z'ye en az 2 harf ekleyin:
<form action="/action_page.php">
<label
for="email">Email:</label>
<input type="email" id="email" name="email"
pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$">
<input type="submit">
</form>
Örnek
type="search" içeren bir <input> öğesi, şu karakterleri İÇERMEZ: ' veya "
<form action="/action_page.php">
<label
for="search">Search:</label>
<input type="search" id="search" name="search"
pattern="[^'\x22]+" title="Invalid input">
<input type="submit">
</form>
Örnek
http:// veya https:// ile başlayıp en az bir karakterle devam etmesi gereken type="url" içeren bir <input> öğesi:
<form action="/action_page.php">
<label
for="website">Homepage:</label>
<input type="url" id="website"
name="website"
pattern="https?://.+" title="Include http://">
<input type="submit">
</form>
❮ HTML <input> etiketi