常用HTML代码

新窗口打开

<a href="https://www.anttoweb.com" target="_blank">安拓网络</a>

拨打电话和短信

<a href="tel:13388888888">13388888888</a>
<a href="sms:13388888888">短信</a>

页面跳转

<meta http-equiv="refresh" content="2;url=https://www.anttoweb.com">

视频

<video src="videofile.mp4" autoplay poster="posterimage.jpg">
  抱歉,您的浏览器不支持内嵌视频,不过不用担心,你可以 <a href="videofile.mp4">下载</a>
  并用你喜欢的播放器观看!
</video>

表单

input 的 type 属性:
number:数字键盘(无小数点)
digit:数字键盘(有小数点)
idcard:数字键盘(无小数点、有个 X 键)

<input type="email" name="user_email" />
<input type="number" name="points" min="1" max="10" />

number 的 maxlength 不生效

type="number"maxlength 不生效,可使用以下方式:

<input type="text" maxlength="3" oninput="this.value=this.value.replace(/[^0-9]/g,'');" id="myId"/>

readonly和disable区别(常用)

readonly只针对input(text / password) 和 textarea有效
disabled对于所有的表单元素都有效
input的字段当为disabled时无法获取数值,可以用readonly带替代,即可解决这类问题。
在某个表单中为用户预填了某个唯一识别代码,不允许用户改动,但是在提交时需要传递该值,此时应该将它的属性设置为readonly
经常遇到当用户正式提交了表单后需要等待管理员的信息验证,这就不允许用户再更改表单中的数据,而是只能够查看,由于disabled的作用元素范围大,所以此时应该使用disabled,但同时应该注意的是要将submit buttondisabled,否则只要用户按了这个按钮,如果在数据库操作页面中没有做完整性检测的话,数据库中的值就会被清除。

Label的用法

<form>
  <label for="male">Male</label>
  <input type="radio" name="sex" id="male" />
  <br />
  <label for="female">Female</label>
  <input type="radio" name="sex" id="female" />
</form>

download的用法

当 download 属性值为空时,下载的文件的名字和扩展名与源文件一致

<a href="test.jpg" download>下载</a>

download 中不指定后缀名,扩展名由浏览器自动检测添加

<a href="test.gif" download="_123_">下载</a>

download 中指定后缀名

<a href="test.gif" download="_123_.gif">下载</a>

是否支持download属性的监测

var isSupportDownload = 'download' in document.createElement('a');

 4,038 total views,  4 views today

Revisions

Comments are closed.