相关疑难解决方法(0)

我想知道是否可以检测浏览器是否在iOS上运行,类似于使用Modernizr进行特征检测的方式(尽管这显然是设备检测而不是功能检测).

通常我更喜欢功能检测,但我需要找出一个设备是否是iOS,因为他们根据这个问题处理视频的方式YouTube API无法使用iPad/iPhone /非Flash设备

我做了一些研究,这个问题已经出现了,但不是我想要的方式.我正在为客户构建一个页面,这是一个QR码登陆,这是一个下载应用程序的地方.因此,他不必在页面上打印出2个QR码,我想检测当前的操作系统(Apple/Android/Other [不支持])并根据该值修改我的元素.

我看过脚本"detectmobilebrowsers",这只是为了告诉用户是否完全是移动的,而我想弄清楚用户运行的操作系统并建议最佳的应用程序版本.

我发现类似于这个问题的其他答案似乎过时或不可靠(没有检测到Android平板电脑浏览器),所以我正在寻找新的东西.我怎样才能做到这一点？(最好使用jQuery - Javascript - PHP的顺序).

在移动设备上显示用于HTML 5输入(即<input>标签)的不同键盘有几种技巧.

例如,一些文档记录在Apple的网站上,为Web视图配置键盘.

这些对于可用性非常有用,但是当涉及到国际邮政编码的输入(主要是数字,但允许使用的字母)时,我们留下了一些糟糕的选择.大多数人建议使用pattern="\d*"技巧来显示数字键盘,但这不允许输入字母.

在type="number"输入型显示常规的键盘,但转移到了数字布局:

这适用于iOS设备,但它使Chrome认为输入必须是数字,甚至改变输入的行为(上/下递增和递减值).

有没有办法让iOS默认为数字布局,但仍然允许输入字母数字？

基本上,我想要iOS行为,type="number"但我希望该字段的行为类似于桌面浏览器上的常规文本字段.这可能吗？

更新:

嗅探iOS的用户代理并使用type="number"输入类型不是一种选择.type="number"不适用于字符串值(如邮政编码),它有其他副作用(如剥离前导零,逗号分隔符等),使其不太适合邮政编码.

根据Apple的文档,当我设置一个类型为numberI 的输入元素时,应该得到一个数字小键盘.

<input type="number"/>

number:用于指定数字的文本字段.在iOS 3.1及更高版本中打开数字键盘键盘.

看起来该死的几乎不可能搞砸了.但是,当我在iPhone或模拟器(iOS6)上查看这个简单的小提琴时,数字键盘不会出现,而是我得到了标准的字母键盘.

http://jsfiddle.net/Cy4aC/3/

我到底能搞到什么呢？

我有一些在桌面上完美运行的 HTML/CSS。

它也适用于移动设备，但输入字段上用于数字选择的向上和向下箭头不会显示，迫使用户手动“输入”数字。客户要求将这些数字旋转箭头保留在移动视图上。

有很多关于如何隐藏/禁用微调器的问题，甚至还有一些关于如何保留微调器的问题，但这些问题没有或不正确的答案，并且遵循这些答案和建议并没有解决这个问题。

        @media only screen {

            input[type=number] {
               /* -moz-appearance: number-input; */   
            }
 
            input[type=number]::-webkit-inner-spin-button,
            input[type=number]::-webkit-outer-spin-button {
                -webkit-appearance: inner-spin-button;
                /***
                 * Below tried and failed: 
                 ***/
                /* -moz-appearance: number-input; */ 
                /*-ms-appearance: inner-spin-button;*/
                /*appearance: auto;*/
                margin: 0;
                opacity: 1;
            }
            
            #updQtyLoose47 {
             /* basic styling */
            background: rgba(245, 235, 170, 0.75);
            border-radius: 0;
            border: none;
            border: solid 1px #dbdbdb;
            color: inherit;
            display: block;
            outline: 0;
            padding: 0.25rem 0 0.25rem 0.75rem;
            text-decoration: none;
            width: 100px; …