HTML 屿§: required
è«ç屿§ã® required 屿§ã¯ãåå¨ããå ´åãææãããã©ã¼ã ãéä¿¡ããåã«ã¦ã¼ã¶ã¼ãå
¥åã«å¤ãæå®ããªããã°ãªããªããã¨ã示ãã¾ãã
required 屿§ã¯ text, search, url, tel, email, password, date, month, week, time, datetime-local, number, checkbox, radio, file ã® <input> å㨠<select> ããã³ <textarea> ã®ãã©ã¼ã ã³ã³ããã¼ã«è¦ç´ ã§å¯¾å¿ãã¦ãã¾ãããããã®å
¥ååãè¦ç´ ã®ä½ããã«è¨å®ãããå ´åã :required æ¬ä¼¼ã¯ã©ã¹ãä¸è´ãã¾ãã屿§ãè¨å®ããã¦ããªãå ´å㯠:optional æ¬ä¼¼ã¯ã©ã¹ãä¸è´ãã¾ãã
ãã®å±æ§ã¯ range 㨠color ã®å
¥ååã«ã¯ãã©ã¡ããæ¢å®å¤ãæã£ã¦ããã®ã§å¯¾å¿ãã¦ãã¾ããããé¢ä¿ãããã¾ããã color åã¯æ¢å®å¤ã #000000 ã§ãã range ã®æ¢å®å¤ã¯ã min 㨠max ã®ä¸éç¹ã§ãã宣è¨ããã¦ããªãå ´åãã»ã¨ãã©ã®ãã©ã¦ã¶ã¼ã§ã¯ min 㨠max ã®æ¢å®å¤ã¯ãããã 0 㨠100 ã§ãã required 㯠hidden å
¥ååã§ã対å¿ãã¦ãã¾ãããã¦ã¼ã¶ã¼ãé表示ã®ãã©ã¼ã ãã£ã¼ã«ãã«è¨å
¥ãããã¨ãæå¾
ã§ããªãããã§ããã¾ãã image ãå«ããã¿ã³å
¥ååãããããã対å¿ãã¦ãã¾ããã
åãååãä»ãããã radio ãã¿ã³ã®ã°ã«ã¼ãã®ã§ã¯ãã°ã«ã¼ãå
ã®ä¸ã¤ã®ã©ã¸ãªãã¿ã³ã« required 屿§ãè¨å®ããã¦ããå ´åããã®å±æ§ãè¨å®ããã¦ãããã®ã§ãªãã¦ãæ§ããªãã®ã§ãããã°ã«ã¼ãå
ã®ã©ã¸ãªãã¿ã³ã®ä¸ã¤ããã§ãã¯ããå¿
è¦ãããã¾ããã³ã¼ãã®ä¿å®æ§ãåä¸ãããããã«ãã°ã«ã¼ãå
ã®åãååã®ã©ã¸ãªãã¿ã³ãã¹ã¦ã« required 屿§ãè¨å®ããããã¾ãã¯ã©ãã«ãè¨å®ããªãããã«ãããã¨ããå§ããã¾ãã
åãååãä»ãããã checkbox å
¥ååã®ã°ã«ã¼ãã§ã¯ã required 屿§ãã¤ãããã§ãã¯ããã¯ã¹ã®ã¿ãå¿
é ã«ãªãã¾ãã
ã¡ã¢:
aria-required="true" ãè¨å®ããã¨ãããè¦ç´ ï¼ä»»æã®è¦ç´ ï¼ãå¿
é ã§ãããã¨ãã¹ã¯ãªã¼ã³ãªã¼ãã¼ã«ä¼ãã¾ããããã®è¦ç´ ãä»»æã§ãããã©ããã«ã¯é¢ä¿ããã¾ããã
屿§ã®ç¸äºä½ç¨
èªã¿åãå°ç¨ãã£ã¼ã«ãã¯å¤ã夿´ãããã¨ãã§ããªãã®ã§ã required 㯠readonly 屿§ãæå®ããã¦ããå
¥åæ¬ã«ã¯å½±é¿ãä¸ãã¾ããã
ã¦ã¼ã¶ããªãã£
required屿§ãè¨å®ããããã® <input>, <select>, <textarea> ãå¿
é ã§ãããã¨ãã¦ã¼ã¶ã¼ã«ç¥ãããããã«ãã³ã³ããã¼ã«ã®è¿ãã«ç®ã«è¦ãã表示ãæä¾ãã¦ãã ãããããã«ãå¿
é ãã©ã¼ã ã³ã³ããã¼ã«ã :required æ¬ä¼¼ã¯ã©ã¹ã§ã¿ã¼ã²ããã«ããå¿
é ã§ãããã¨ã示ãããã«ã¹ã¿ã¤ã«ä»ããã¦ãã ãããããã«ãããè¦è¦éç¢è
ã®ã¦ã¼ã¶ã¼ã®ã¦ã¼ã¶ã¼ããªãã£ãåä¸ãã¾ãããããã aria-required="true" ã追å ãã¦ãããã©ã¦ã¶ã¼ã¨ã¹ã¯ãªã¼ã³ãªã¼ãã¼ã®çµã¿åãããã¾ã required ã«å¯¾å¿ãã¦ããªãå ´åã«ã¯åé¡ããã¾ããã
å¶ç´æ¤è¨¼
è¦ç´ ãå¿
é ã§ããã¤è¦ç´ ã®å¤ã空æååã®å ´åããã®è¦ç´ 㯠valueMissing ã«æ©ã¾ããããã®è¦ç´ ã :invalid æ¬ä¼¼ã¯ã©ã¹ã«ä¸è´ãã¦ãã¾ãã
ã¢ã¯ã»ã·ããªãã£ã®èæ ®
ã¦ã¼ã¶ã¼ã«ãã©ã¼ã ã³ã³ããã¼ã«ãå¿ é ã§ãããã¨ãç¥ããã表示ãæä¾ãã¦ãã ãããè²ç²ãèªç¥æ©è½ã®éããã¹ã¯ãªã¼ã³ãªã¼ãã¼ã使ç¨ãã¦ãããã©ããã«ãããããããã¹ã¦ã®ã¦ã¼ã¶ã¼ãè¦ä»¶ãçè§£ã§ããããã«ãã¡ãã»ã¼ã¸ãä¼ãããã®ãããã¹ããè²ããã¼ãã³ã°ã屿§ãªã©ã®å¤é¢çãªãã®ã§ãããã¨ã確èªãã¦ãã ããã
ä¾
>HTML
<form>
<div class="group">
<input type="text" />
<label>Normal</label>
</div>
<div class="group">
<input type="text" required />
<label>Required</label>
</div>
<input type="submit" />
</form>
çµæ
仿§æ¸
| Specification |
|---|
| HTML > # attr-input-required > |
| HTML > # attr-select-required > |
| HTML > # attr-textarea-required > |