w3cschool-h5 양식 속성을 참조하여 가장 완전한 양식 속성을 얻을 수 있습니다. 여기서는 공통 속성만 설명합니다
사용자의 입력을 녹음하고 프롬프트를 표시하는 역할입니다.
autocomplete
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form action="" > <input type="text" autocomplete="on" name="userName"> <input type="submit"> </form> </body> </html>
사용 참고 사항:
속성을 추가해야 합니다name
페이지에 입력할 요소가 많은 경우 사용자는 입력할 요소를 마우스로 클릭해야 사용자 경험을 향상할 수 있습니다. ,속성을 사용하여 페이지에서 기본으로 선택된 요소를 지정하려면
autofocus
사용법:
초점을 얻으려면 속성만 추가하면 됩니다. 表单元素
샘플 코드:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form action="" > 姓名:<input type="text" name="userName"> <br/> 年龄<input type="number" name="telNum" autofocus> <input type="submit"> </form> </body> </html>
사용 참고 사항:
<a href="http://www.php.cn/wiki/48.html" target="_blank">JavaScript를 사용할 수 있습니다. 요소를 지정하는 <p></p></a>
<a href="http://www.php.cn/wiki/48.html" target="_blank">JavaScript</a>
데이터를 제출하려면 해당
의 제약을 받지 않습니다. 사용법:
을 사용하여 表单外
요소를 생성하려면 요소에 该表单
속성을 추가하고 form="表单id"
表单id
와 연결하려는
태그와 ID를 양식 외부에 입력하여 양식 input
userForm
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form action="" id="userForm" > 姓名:<input type="text" name="userName"> <br/> 年龄:<input type="number" name="telNum" autofocus> <br/> <input type="submit"> </form> <br/> 爱好:<input type="text" name="habbit" form="userForm"> </body> </html>
태그에서 여러 값을 선택하려면 이 속성을 사용할 수 있습니다
input
<a href="%EC%9C%A0%ED%98%95%EC%9D%98" target="_blank">파일<li></a>
<a href="http://www.php.cn/wiki/1313.html" target="_blank">file</a>
버튼을 길게 눌러야 합니다ctrl
9c92d2f215870f0574b39feac29f6c10
을 사용해야 합니다. 속성이 나타남
JavaScript
placeholder
JavaScript
placeholder.png
显示效果如下
<input type="text"placeholder="输入用户名">
除了在input标签中增加了一些新的
type
属性以外,H5
也推出了一些新的表单元素,由于浏览器的兼容问题,使用频率并不广,了解即可 w3cSchool_新表单元素
该元素规定了输入区域的选项列表,可以让用户有一些选项
测试代码:
注:测试代码只是body
内部的代码
网址:<input type="url" list="url_list" name="link"/> <datalist id="url_list"> <option label="W3School" value="http://www.W3School.com.cn"/> <option label="Google" value="http://www.google.com"/> <option label="Microsoft" value="http://www.microsoft.com"/> </datalist> 电话: <input type="tel" list="tel_list"> <datalist id="tel_list"> <option value="186xxx" label="移动">移动</option> <option value="187xxx" label="联通">联通</option> <option value="135xxx" label="天翼">天翼</option> </datalist>
datalist:
id:id属性,想要使用该datalist
的元素需要通过list=id
的方式来指定
option:
value:指定具体的值
label:提示信息
注意:
如果input的type为url
,option
中对应的value需要使用http://
开始
keygen 元素是密钥对生成器(key-pair generator)。当提交表单时,会生成两个键,一个是私钥,一个公钥。
私钥(private key)存储于客户端,公钥(public key)则被发送到服务器。公钥可用于之后验证用户的客户端证书(client certificate),即实现非对称加密
目前,浏览器对此元素的糟糕的支持度不足以
使其成为一种有用的安全标准。
使用频率:低
属于新的语义标签:用来放置输出的内容,但是不能自动的计算结果,依旧需要通过js的方式来动态修改结果,只是相比于其他的标签,
语义性更强
。
使用频率:低
【相关推荐】
1. 免费h5在线视频教程
2. HTML5 完整版手册
위 내용은 HTML5 새로운 양식 속성에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!