|
2021. március 3. 15:08 szerda, ma Kornélia névnap van |
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ő: ![]() ![]() |
![]() ![]() ![]() ![]() |