UI 对 select 元素的原生 UI 覆盖是否可以进行特征检测?
Can native UI overrides of select element be feature-detected?
许多浏览器在元素正下方的简单框中显示 select 元素的选项,如下所示:
但是在 iOS 上的 Safari 上,选项显示在一个大型原生微调器中,如下所示:
有没有一种方法可以检测浏览器是否会对 select 元素使用本机 UI 而不是 "standard" UI? 我想有条件地向使用可用浏览器的用户显示 select 框,我宁愿不必求助于用户代理嗅探。
示例信用:Gonçalo Morais
我认为没有像您要求的那样专门设计为 "feature"。我相当确定您将需要求助于用户代理检测,因为这正是 iOS 上的 Safari 选择 呈现 元素的方式 - 对我来说它不会Safari 团队可以向 SELECT 元素或 DOM 元素的任何其他位置添加一个属性来表明这一点。您查询的 "feature" 本质上是用户代理字符串。
你可能知道这一点,但为了完成,我在这里提到它。有很多方法可以实现这一点 - 例如,您可以使用 Modernizr - 向它添加自定义测试以根据您的需要进一步自定义它 - 请参见 this 作为示例。或者使用您自己的 JavaScript。或者使用 JavaScript 将特定的 class 添加到正文或 html 元素以指示它是什么浏览器,以便您可以向下层叠并自定义您的元素(本质上是 Modernizr 所做的)。
我知道这可能不是您所希望的答案,但我很确定它在很大程度上是准确的。我很想听听不同的意见。
许多浏览器在元素正下方的简单框中显示 select 元素的选项,如下所示:
但是在 iOS 上的 Safari 上,选项显示在一个大型原生微调器中,如下所示:
有没有一种方法可以检测浏览器是否会对 select 元素使用本机 UI 而不是 "standard" UI? 我想有条件地向使用可用浏览器的用户显示 select 框,我宁愿不必求助于用户代理嗅探。
示例信用:Gonçalo Morais
我认为没有像您要求的那样专门设计为 "feature"。我相当确定您将需要求助于用户代理检测,因为这正是 iOS 上的 Safari 选择 呈现 元素的方式 - 对我来说它不会Safari 团队可以向 SELECT 元素或 DOM 元素的任何其他位置添加一个属性来表明这一点。您查询的 "feature" 本质上是用户代理字符串。
你可能知道这一点,但为了完成,我在这里提到它。有很多方法可以实现这一点 - 例如,您可以使用 Modernizr - 向它添加自定义测试以根据您的需要进一步自定义它 - 请参见 this 作为示例。或者使用您自己的 JavaScript。或者使用 JavaScript 将特定的 class 添加到正文或 html 元素以指示它是什么浏览器,以便您可以向下层叠并自定义您的元素(本质上是 Modernizr 所做的)。
我知道这可能不是您所希望的答案,但我很确定它在很大程度上是准确的。我很想听听不同的意见。