滑块在jQuery Mobile中不起作用 [英] Slider not working in jQuery Mobile

问题描述

我正在尝试使用jQuery Mobile中的滑块小部件，并且只是从文档中复制了代码:

I'm trying the slider widget in jQuery Mobile, and just copied the code from the docs:

    <div data-role="fieldcontain">
        <label for="slider">Input slider:</label>
        <input type="range" name="slider" id="slider" value="0" min="0" max="100"/>
    </div>

但是，这根本不符合预期.当我在Safari中拖动滑块时，数字几乎是随机变化的.它们从0增加到9，然后在滑块的最右边回到0，然后当我向后滑动时，它在0和9之间来回移动.

But this doesn't work as expected at all. When I drag the slider in Safari the numbers change almost randomly. They increase from 0 to 9 and then at the far right of the slider it goes back to 0, and then when I slide back it goes back and forth between 0 and 9...

我做错什么了吗?

我正在CodeIgniter应用程序中使用它.

I am using this inside a CodeIgniter application.

我刚刚发现它可以在iPhone上正常运行，但不能在桌面上的Safari中运行.它仍然很奇怪，因为首先我需要它在桌面上进行开发，其次，它可以在jQuery Mobile演示站点上工作...我试图查看该代码，甚至精确地复制它，但是仍然在我的页面上不起作用.

I just found out that it actually works when live on the iPhone, but not in Safari on the desktop. It's still weird, because first of all I need it to work on the desktop for development, and secondly, it works on the jQuery Mobile demo site... I have tried looking at that code, and even copying it exactly, but still it doesn't work on my page.

我已更新到RC2，而演示页面上的脚本仍为beta 2，可以吗?

I have updated to RC2, while the script on the demo page is still beta 2, could that be it?

不，不是吗...我检查了旧文档，但是最新文档的新文档中的示例在其演示页面上也能正常工作.所以这是另外一回事.

No, that was not it... I had checked the old docs, but the example in the new docs with the latest release worked fine on their demo page as well. So it's something else.

推荐答案

我自己找到答案的排序.当我在Safari中的Web检查器中查看jQuery Mobile样式表时，已将输入字段的宽度设置为50px.如果我将其增加到70像素，我会发现值实际上正在增加，只是我之前只看到了左数字.奇怪的是，即使使用相同的样式表，在他们的演示站点上似乎也能正常工作！无论如何，我通过覆盖该规则并将其设置为70px来使其正常工作.

Sort of found the answer myself. The jQuery Mobile stylesheet when I looked in the web inspector in Safari had set the width of the input field to 50px. If I increased that to 70px I noticed that the values were in fact increasing, it was just that I only saw the left digit before. Strangely, it seems to be working fine on their demo site, even though the same stylesheet is used! Anyway, I got it working by overriding that rule and setting it to 70px.

这篇关于滑块在jQuery Mobile中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！