Невозможно получить индекс из диапазона слайдера пользовательского интерфейса jQuery - PullRequest
Новая
       25

Невозможно получить индекс из диапазона слайдера пользовательского интерфейса jQuery

2 голосов
/ 25 апреля 2010

Я чертовски долго пытался получить (как я думал, был) простой индекс из коллекции нескольких ползунков. HTML выглядит следующим образом: 

<div id="left-values" class="line">
    <span id="l1" style="padding: 0 1.8em;">0</span>
    <span id="l2" style="padding: 0 1.8em;">0</span>
    <span id="l3" style="padding: 0 1.8em;">0</span>
    <span id="l4" style="padding: 0 1.8em;">0</span>
    <span id="l5" style="padding: 0 1.8em;">0</span>
    <span id="l6" style="padding: 0 1.8em;">0</span>
    <span id="l7" style="padding: 0 1.8em;">0</span>
    <span id="l8" style="padding: 0 1.8em;">0</span>
</div>

И код jQuery: 

    // setup audiometry sliders
    $("#eq > span").each(function (e) {
        // read initial values from markup and remove that
        var value = parseInt($(this).text());
        // var index = $(this).index; <- this didn't work.

        $(this).empty();
        $(this).slider({
            value: value,
            slide: function (event, ui) {
                //console.log($(this).attr('id')); <- neither did this.
                //console.log(index);
                $('#left-values span:first').text(ui.value);
            }
        })
    });

Проблема в том, что пользовательский интерфейс jQuery - при создании слайдера - заменяет существующий HTML своей собственной разметкой. Это включает в себя любые значения идентификатора и, по любой причине, я не могу получить индекс для данного ползунка, чтобы всплыть. Так что у меня заканчиваются идеи.

Ответы [ 2 ]

2 голосов
/ 25 апреля 2010

Вы можете получить индекс так: 

$("#eq > span").each(function (index, Element) {
    alert(index);
    ...

см. http://api.jquery.com/each/

1 голос
/ 25 апреля 2010

То, что у вас работает, может быть, у вас есть что-то еще происходит. Вот отдельный пример, смотрите вывод консоли: http://jsfiddle.net/FBh3a/1/

$("#eq > span").each(function (e) {
    var value = parseInt($(this).text());    
    $(this).empty();
    $(this).slider({
        value: value,
        min: -10,
        max: 10,
        slide: function (event, ui) {
          console.log($(this).attr('id')); //<- works here, outputs l1, l2, etc
          console.log($(this).index()); //outputs 0, 1 .... 7 (0-based index)
        }
    });
});​
...