A部分:
我知道有很多东西可以告诉你浏览器是否支持某个HTML5属性,例如http://diveintohtml5.info/detect.html,但他们不会告诉你如何从单个元素获取类型并使用这些信息初始化你的插件。
所以我试着:
alert($("input:date"));
//returns "[object Object]"
alert($("input[type='date']"));
//returns "[object Object]"
alert($("input").attr("type"));
//returns "text" ... which is a lie. it should have been "date"
这些都不管用。
我最终想出了这个(这是可行的):
var inputAttr = $('<div>').append($(this).clone()).remove().html().toLowerCase();
alert(inputAttr);
// returns "<input min="-365" max="365" type="date">"
谢谢:
所以我的第一个问题是: 1.为什么我不能在不支持html5的浏览器中读取“类型”属性?您可以编造任何其他属性和伪值并读取它。2.为什么我的解决方案有效?它是否在DOM中有什么关系呢?
B部分:
下面是我使用检测器的一个基本示例:
<script type="text/javascript" >
$(function () {
var tM = document.createElement("input");
tM.setAttribute("type", "date");
if (tM.type == "text") {
alert("No date type support on a browser level. Start adding date, week, month, and time fallbacks");
// Thanks: http://diveintohtml5.ep.io/detect.html
$("input").each(function () {
// If we read the type attribute directly from the DOM (some browsers) will return unknown attributes as text (like the first detection). Making a clone allows me to read the input as a clone in a variable. I don't know why.
var inputAttr = $('<div>').append($(this).clone()).remove().html().toLowerCase();
alert(inputAttr);
if ( inputAttr.indexOf( "month" ) !== -1 )
{
//get HTML5 attributes from element
var tMmindate = $(this).attr('min');
var tMmaxdate = $(this).attr('max');
//add datepicker with attributes support and no animation (so we can use -ms-filter gradients for ie)
$(this).datepick({
renderer: $.datepick.weekOfYearRenderer,
onShow: $.datepick.monthOnly,
minDate: tMmindate,
maxDate: tMmaxdate,
dateFormat: 'yyyy-mm',
showAnim: ''});
}
else
{
$(this).css('border', '5px solid red');
// test for more input types and apply init to them
}
});
}
});
</script>
现场示例:http://joelcrawfordsmith.com/sandbox/html5-type-detection.html
还有一个帮助/问题:有没有人能帮我在HTML5输入类型修复器中减掉一些脂肪?
我的功能关闭了(向IE6-IE8和FF添加了后备功能,但没有添加要初始化的类)
有没有更有效的方法来迭代神秘输入类型的DOM?在我的示例中,我应该使用If Else、函数或case吗?
谢谢大家,
乔尔
https://stackoverflow.com/questions/4159838
复制相似问题