WEB(三)_HTML5中Input 属性介绍

原创
2015/03/27 12:34
阅读数 160

本文就不对text和password进行介绍

<input type='search'>  //表示搜索框
<input type='number'>  //表示数字类型输入框
<input type='range'>  //表示范围选择滑块
<input type='color'>  //表示颜色选择器
<input type='tel'>  //表示电话号码输入框
<input type='url'>  //表示网址输入框
<input type='email'>  //表示email地址输入框
<input type='date'>  //表示日期选择器
<input type='month'>  //表示月份输入框
<input type='week'>  //表示星期输入框
<input type='time'>  //表示时间戳输入框
<input type='datetime'>  //表示精确日期/时间戳输入框
<input type='datetime-local'>  //表示当地日期和时间输入框

如果浏览器不支持type属性,会默认text,这点是我们判断的有利线索

我们来自己创建一个DOM对象

function isType(){
    var obj=document.createElement("input");
    obj.setAttribute("type","color");
    return obj.type!=="text";
}
//如果对!==不理解的可以自行百度,可以从搜索===来学习!==的意思


-------------------------------下面介绍占位符placeholder的介绍和判断-----------------------------------

<input type='text' placeholder='请输入邮箱/手机号/账号'>
//判断浏览器是否支持
function isPlaceholder(){
    var obj=document.createElement('input');
    return 'placeholder' in obj;
}
//obj是input对象,obj可以继承或获得input带的所有属性,它们以数组的形式放置。
//i in obj是for in的变形,在java中是for(;;;)但js有for(var i in obj)的使用方法,为什么可以怎么写,请百度
//js for in

用上面的placeholder例子就可以推断自动对焦autofocus的用法和判定了

<input autofocus='autofocus'>
<!--
    也可以是autofocus="1"  带数字的
    <input autofocus='1'>
    <input autofocus='2'>
    <input autofocus='3'>
    用tab建就能一次切换,焦点,按低到高进行的
-->

作者:五谷子(wuguzi)








展开阅读全文
加载中
点击引领话题📣 发布并加入讨论🔥
0 评论
0 收藏
0
分享
返回顶部
顶部