Слайдер не работает в jQuery Mobile

Question

Я пытаюсь использовать виджет-слайдер в jQuery Mobile и просто скопировал код из документов:

    <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 ...

Я что-то не так делаю??

Я использую это внутри приложения CodeIgniter.

РЕДАКТИРОВАТЬ:

Я только что узнал, что это на самом деле работает, когда живу на iPhone, но не в Safari нарабочий стол.Это все еще странно, потому что, во-первых, мне нужно, чтобы он работал на рабочем столе для разработки, а во-вторых, он работает на демонстрационном сайте jQuery Mobile ... Я попытался просмотреть этот код и даже точно его скопировать, но все же онне работает на моей странице.

Я обновился до RC2, хотя скрипт на демонстрационной странице все еще бета-версия 2, не так ли?

РЕДАКТИРОВАТЬ 2:

Нет, это было не так ... Я проверил старые документы, но пример в новых документах с последним выпуском отлично работал и на их демонстрационной странице.Так что это что-то еще.

Answer 1

имейте в виду, что версия 1.0.1 jqueryMobile не полностью совместима с jquery 1.7.1, и это делает слайдер не работающим в некоторых браузерах. Попробуйте понизить jquery до версии 1.6.4 , и слайдер должен начать работать

Answer 2

Я заметил эту же проблему, но я полагаю, что это связано с использованием экспериментального scrollview ... Если я закомментирую мои сценарии scrollview, ползунок переключателя переворота снова будет работать.

Answer 3

Вроде нашел ответ сам.Таблица стилей jQuery Mobile, когда я просматривал веб-инспектор в Safari, установила ширину поля ввода в 50 пикселей.Если я увеличил его до 70px, я заметил, что значения на самом деле увеличивались, просто раньше я видел только левую цифру.Странно, но на их демонстрационном сайте он работает нормально, хотя используется та же таблица стилей!В любом случае, я получил его, переопределив это правило и установив его на 70px.

Answer 4

Хм, не уверен, что еще происходит в вашем коде, вот пример:

• http://jsfiddle.net/sYQAu/1/

Слайдер Документы:

• http://jquerymobile.com/demos/1.0rc2/docs/forms/slider/index.html

HTML

<div data-role="page" id="slider-test">
    <div data-role="content">

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

    </div>
</div>

Кстати, я использую Chrome в Ubuntu 10.04, если это имеет значение, это может быть проблема с рабочим столом Safari. Попробуйте использовать другой браузер, так как ваш код мне подходит