检查浏览器HTML5与PHP的兼容性 [英] Check Browser HTML5 Compatibility with PHP

问题描述

我想使用输入类型或HTML5中的其他功能。但并非所有浏览器都支持这些HTML5功能。

I want to use input types or other features from HTML5. But not all browsers support these HTML5 features.

如何检查用户的浏览器是否与仅限PHP代码兼容？？

How can I check if a user's browser is html5 compatible with PHP code only?.

顺便说一句，我不喜欢 modernizr 。我必须弄清楚PHP。

By the way, I don't like modernizr. I have to figure out with PHP.

示例：

兼容Html5的浏览器：

Html5 compatible browser:

<input type="date" value="" />

Html5不兼容的浏览器：

Html5 incompatible browser:

<input id="datepicker" type="text" value="" />

推荐答案

PHP 真的错误的地方做这种检测。有很多理由说明这是一个坏主意，而且它们在许多地方都有很好的记录。

PHP is really the wrong place to be doing this kind of detection. There are any number of reasons why it's a bad idea, and they're well documented in many places.

成功使用浏览器兼容性的关键是检测对您需要的功能，并填充或优雅地降低这些特定功能。检测实际的浏览器或浏览器版本是不好的做法，很可能会给你带来误报和误报的问题。由于练习的重点是避免兼容性故障，因此结果不准确会使整个事情有点自我失败。

The key to successfully working with browser compatibility is to detect support for the features you need, and either polyfill or gracefully degrade those specific features. Detecting the actual browser or browser version is poor practice and is likely to give you problems with both false positives and false negatives. Since the whole point of the exercise is to avoid compatibility glitches, having inaccurate results makes the whole thing somewhat self defeating.

对于特征检测，Modernizr是一个很棒的小工具，但如果你真的不像你在问题中所说的那样相处，这里有一个小小的JS函数，它专门检测对日期输入字段类型的支持：

For feature detection, Modernizr is a great little tool, but if you really don't get along with it as you say in the question, here's a tiny little JS function that specifically detects support for the date input field type:

/**
 * @returns boolean - True if browser suppors 'date' input type.
 */
function browserSupportsDateInput() {
    var i = document.createElement("input");
    i.setAttribute("type", "date");
    return i.type !== "text";
}

正如你所看到的，这真的很简单。 （顺便说一下，你可以在这里更详细地找到它）

As you can see, it really is simple stuff. (You can find it documented in more detail here, by the way)

使用您网站上的该功能，现在可以非常轻松地填充日期字段。

With that function in your site, it now becomes extremely easy to polyfill the date field.

这是您的HTML：

<input type='date' name='whatever' class='datepicker'>

现在你可以使用一小部分jQuery执行以下操作：

Now you can have a tiny bit of jQuery that does the following:

$(function() {
    if(!browserSupportsDateInput()) {
        $(".datepicker").datepicker();
    }
});

简单。

当然，Modernizr会让它变得更好。 Modernizr本身不进行polyfill，所以如果不支持日期输入类型，你仍然需要类似上面的代码来应用datepicker插件，但是我在上面的代码中没有做过的Modernizr做的是如果需要，允许您告诉浏览器只打扰加载datepicker库。这将为现代浏览器节省大量带宽。 Modernizr让这种事变得很容易。

Of course, Modernizr would make it better. Modernizr doesn't do the polyfill itself, so you'd still need code similar to the above to apply the datepicker plugin if the date input type wasn't supported, but what Modernizr does which I haven't done in my code above is to allow you to tell the browser to only bother loading the datepicker library if it's needed. This would save a lot of bandwidth for modern browsers. Modernizr makes this kind of thing dead easy.

希望上面的内容能为你提供一些关于做这种事情的最好方法的思考。这都是关于最佳实践的。如果您认为必须在PHP中执行此操作，那么就这样吧，但请注意，您反对几乎所有专家的推荐，这会让您更加头疼从长远来看。

Hopefully the above will give you some food for thought about the best way to do this kind of thing. It's all about best practice. If you feel you must do it in PHP, then so be it, but just be aware that you're going against the recommendation of pretty much every expert out there, and it will give you more headaches in the long run.

这篇关于检查浏览器HTML5与PHP的兼容性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！