Ebben a tutorial-ban az űrlapok manipulálásáról lessz szó.

Ha például egy input mezőnél beállitjuk a value értékét akkor az lessz az alapértelemezett szöveg az input mezőben.

<input type="text" value="blabla"/>

Csak hát ugye az megmarad és mindig kikell törölni.

Namármost ezt html5-ben ugynézki,hogy placeholder="blabla" ez ennyiban különbözik a value értéktöl,hogy itt a beirt szöveg eltünik ha elkezdünk beleirni és nem kell javascriptel bajlódni.

1

<input type="text" placeholder="blabla"/>

De természetesen ez is böngésző függő chromeval firefoxal és opearával biztosan müködik de explorerben nem mint annyi sok minden.

A másik dolog amit megszeretnék emliteni az a mezők kitöltésének kötelzővé tétele.

Gondolok itt olyanra,hogy például egy regisztrációnál ha nem töltesz ki egy mezőt akkor feljön egy üzenet,hogy a mező kitöltése kötelező,amit általában javascriptel szoktak megoldani.

Ez html5-ben ugynézki,hogy bekell irni az input mezőbe azt ,hogy required,ezzel kötelezővé  tesszük a mező kitöltését.

1

<input type="text" required />

Így a böngésző alapértelmezett nyelvén fog előugrani egy ablak,hogy Kérjük, töltse ki ezt a mezőt.

És végül egy kis kód a teszteléshez.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

<table width="380" border="0" cellspacing="2" cellpadding="0">
<form method='post' action="">
 
 <tr>
 <td width = '150'><div align='right'><label for="username">Felhasználónév:</label></div></td>
 <td><input type="text" name="username" id="username" value="" placeholder="Név" />
</td>
 </tr>
 
 <tr>
 <td width = '150'><div align='right'><label for="password">Jelszó:</label></div></td>
 <td><input type="password" name="password" id="password" value="" placeholder="Jelszó" /><br />
</td> 
 </tr>
 <tr>
 <td width = '150'><div align='right'><label for="textarea">textarea</label></div></td>
 <td><textarea name="password" id="textarea" required value="" placeholder="Üzenet" ></textarea>
 </tr>
 <tr>
 
 <td width = '150'><div align='right'><label for='submit'></label></div></td>
 <td><input type="submit" name="ok" value="Belépés" /></td>
 </tr>
 
</form>
</table>

Szerző: tonek Hozzászólások(0)