HTML Required属性

📌 相关文章

📜 HTML Required属性

📅 最后修改于: 2020-11-03 09:57:04 🧑 作者: Mango

HTML Required属性是一个布尔属性，它指定在提交表单之前必须填写输入元素。此属性与以下元素一起使用：

</li> </ul> <h4><input></h4> <p>我们可以轻松地将所需属性与<input>元素，如以下语法所示：</p> <div class="hcb_wrap"> <pre class="prism line-numbers lang-python" data-lang="Java"><code><span span="" style="font-size: 10pt;"><input required> </span></code></pre> </div> <p>例</p> <div class="hcb_wrap"> <pre class="prism line-numbers lang-python" data-lang="Java"><code><span span="" style="font-size: 10pt;"><html> <head> <title> Example of required attribute with input element </title> <style> div { padding: 10px 0; } </style> <head> <body> <form> <div> <label>Name</label> <input type="text" placeholder="Enter Name" name="name" required> </div> <div> <label> E-mail </label> <input type="email" placeholder="Enter email ID" name="email" required> </div> <div> <label> Mobile No. </label> <input type="text" placeholder="Enter Your Mobile No." name="mobileno" required> </div> <div> <label>Password</label> <input type="password" placeholder="Enter Password" name="psw" required> <br> </div> <button type="submit" VALUE="SUBMIT"> SUBMIT </button> </form> </body> </html> </span></code></pre> </div> <p>输出：</p> <p><img class="img-fluid" src="https://mangdo-1254073825.cos.ap-chengdu.myqcloud.com/front_eng_imgs/javatpoint/html/html-required-attribute.png"/></p> <h4><select></h4> <p>我们可以轻松地将所需属性与<select>元素，如以下语法所示：</p> <div class="hcb_wrap"> <pre class="prism line-numbers lang-python" data-lang="Java"><code><span span="" style="font-size: 10pt;"><select required> </span></code></pre> </div> <p>例</p> <div class="hcb_wrap"> <pre class="prism line-numbers lang-python" data-lang="Java"><code><span span="" style="font-size: 10pt;"><html> <head> <title> Example of required attribute with select option </title> <style> div { padding: 10px 0; } </style> <head> <body> <form> <label> Course : </label> <select required> <option value="">None</option> <option value="BCA">BCA</option> <option value="BBA">BBA</option> <option value="B.Tech">B.Tech</option> <option value="MBA">MBA</option> <option value="MCA">MCA</option> <option value="M.Tech">M.Tech</option> </select> <button type="submit" VALUE="SUBMIT"> SUBMIT </button> </form> </body> </html> </span></code></pre> </div> <p>输出：</p> <p><img class="img-fluid" src="https://mangdo-1254073825.cos.ap-chengdu.myqcloud.com/front_eng_imgs/javatpoint/html/html-required-attribute2.png"/></p> <h4><html><textarea></ html></h4> <p><html>我们还可以轻松地将所需属性与<textarea>元素，如以下语法所示：</ html></p> <div class="hcb_wrap"> <pre class="prism line-numbers lang-python" data-lang="Java"><code><span span="" style="font-size: 10pt;"><textarea required> </span></code></pre> </div> <p>例</p> <div class="hcb_wrap"> <pre class="prism line-numbers lang-python" data-lang="Java"><code><span span="" style="font-size: 10pt;"><html> <head> <title> Example of required attribute with textarea </title> <style> div { padding: 10px 0; } </style> <head> <body> <form> Any Comment : <br> <textarea cols="80" rows="5" placeholder="Enter a comment" value="address" required>

输出：

浏览器支持

Element	Chrome	IE	Firefox	Opera	Safari
	Yes	Yes	Yes	Yes	Yes