87,915
社区成员
发帖
与我相关
我的任务
分享
$(".datepicker").each(function(){
var param = {
autoSize : true,
changeMonth : true,
changeYear : true,
dateFormat : "yy-mm-dd"
};
//下面的this指的就是input元素对应的dom对象,即:document.getElementsByTagName('input')[0]
//也正是因为是dom对象,所以具有dataset属性。如果换做$(this).dataset就会报错,因为$(this)
//是jquery对象,没有这样的属性。
if (this.dataset && this.dataset.defaultdate)
param.defaultDate = this.dataset.defaultdate;
else
param.minDate = 1;
//下面的$(this)就是input元素对应的jquery对象,
//html元素对应的jquery对象有很多jquery已经写好的方法可以调用比如.css()设置样式,
//.attr()读取属性等等。除了这些jquery自带方法外,网上还有很多插件(也就是别人写好的方法)
//供jquery对象调用。你用的datepicker就是一个插件(新方法)。
//同理如果是this.datepicker()也会报错,因为只有jquery对象($(this))才能调用该方法。
$(this).datepicker(param);
});
(2)HTML5虽然有很多好的特性和便捷的用法,但只是趋势尚未成标准,浏览器的支持也不尽人意,因此实际开发中很少会用到,个人觉得大体了解下即可。至于官方文档,本人也未曾仔细研究过,基本都是在W3c上看的,楼主可以参考下。
http://www.w3school.com.cn/html5/index.asp
<input name="birthdate" class="datepicker" data-defaultdate="-20y" readonly="readonly"/>
//接下来取一下input.dataset并验证
var ele=document.getElementsByTagName('input')[0],
obj=ele.dateset;
console.log(typeof obj);//浏览器控制台显示结果为:object
console.log(obj);//浏览器控制台显示结果为:{defaultdate: "-20y"}
再回到你的例子中,'if (this.dataset && this.dataset.defaultdate)'的用法就很简答明了了,同理如果input标签中还有其他的data-name=value,在js中都可以通过this.dataset.name来获取value。
(2)不过通过dataset获取到的对象并不是js传统意义上的对象,它在HTML5中的名称是DomStringMap,它有许多有用且有意思的特性,但是它的兼容性不太好,楼主可以自行google一下。