为 Mobile Safari (webkit) 重新创建 HTML5 范围输入? [英] Recreating the HTML5 range input for Mobile Safari (webkit)?

问题描述

所以我一直在开发一个用于工作的 HTML5 iPad 应用程序，但遇到了一个问题.我在第一次使用这个应用程序时没有使用 iPad，依靠桌面 Safari 来快速组合我的应用程序(无论如何，可能不是最好的事情......)

So I've been working on a HTML5 iPad application for work and have come across a problem. I didn't have access to an iPad whilst first working on this app and relied on desktop Safari to get my app quickly together (probably not the best thing, anyhow...)

我不得不依赖界面的一部分的输入范围.看到 HTML5 有一个范围输入后，我很高兴，因为这正是我所需要的.我什至设法将其设计成完全符合设计的样式:

I'm having to rely on a input range for a part of the interface. After seeing that HTML5 had a range input, I was happy as this is just what I needed. I even managed to style it up to exactly what was designed:

这太棒了！...直到我真的在 iPad 上尝试了它，但它不起作用.只显示一个文本输入.我现在想知道该怎么做...我确实需要一个滑块，拖动时它会吐出数据.显然需要与触摸一起工作.找遍了整个网络，似乎没有一个可靠的解决方案.

This is great! ...until I actually tried it on an iPad and it doesn't work. Just shows a text input. I'm now wondering what to do... I do need a slider, something that when dragged, it spits out the data. Obviously needs to work with touch. After looking around all over the web, there doesn't seem to be a solid solution.

你们有什么建议吗?编写可工作的触摸友好滑块的正确方法是什么，就像它不支持的原生 HTML5 滑块一样！?

What do you guys suggest here? What's the proper way of coding up a working touch-friendly slider, just like the native HTML5 one that it doesn't support!?

任何想法/想法/知识/经验将不胜感激！詹姆斯

Any ideas/thoughts/knowledge/experience would be greatly appreciated! James

推荐答案

我遇到了完全相同的问题，只是使用 iPhone.

I have exactly the same problem, only with an iPhone.

这是因为 Mobile Safari 只支持 HTML5 的一个子集.我正在使用 JqTouch，这给我带来了各种各样的问题，因此请避免使用此框架.

This is because Mobile Safari only supports a subset of HTML5. I am using JqTouch which is causing me all manner of issues so do avoid this framework.

看看jquery mobile.它目前是 Alpha 3，但有一个适用于 iOS 的滑块控件.

Take a look at jquery mobile. Its currently Alpha 3, but has a slider control which works on iOS.

希望对你有所帮助.

这篇关于为 Mobile Safari (webkit) 重新创建 HTML5 范围输入?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！