JQuery выберите проблему

Question

В приведенном ниже коде есть функция, которая преобразует класс слайдера в управление слайдером. Он имеет функцию, которая выполняется при возникновении события «slide».

  $(function(){
                $(".slider").slider({
                    value: 0,
                    min: 0,
                    max: 5,
                    step: 1,
                    slide: function(event, ui) {
                        $(".slideinput > input.slidevalue").val(ui.value);
                    }
                });
            });

Этот код не работает, когда у меня есть несколько ползунков на одной странице. (это меняет их все) Как я могу это исправить? Я не знаю, как установить второй элемент select, чтобы выбрать только элемент с уникальным идентификатором. (идентификатор генерируется динамически)

Некоторый HTML-код для иллюстрации расположения элементов.

<div class="item"> 
            <p class="head"> 
                A kako biste općenito ocijenili sljedeće aspekte ljetne turističke ponude u Hrvatskoj: Kvaliteta smještaja?</p> 

            <div class="slideinput" style="width: 220px; height: 20px; padding-top: 10px; padding-left: 8px;"> 
                <div style="width: 200px;" class="slider"> 
                </div> 
                <input class="slidevalue" id="q34" name="q34" type="hidden" value="0" /> 
            </div> 

        </div> 

        <div class="item"> 
            <p class="head"> 
                Broj plaža?</p> 

            <div class="slideinput" style="width: 220px; height: 20px; padding-top: 10px; padding-left: 8px;"> 
                <div style="width: 200px;" class="slider"> 
                </div> 
                <input class="slidevalue" id="q35" name="q35" type="hidden" value="0" /> 
            </div> 

        </div> 

        <div class="item"> 
            <p class="head"> 
                Urednost plaža?</p> 

            <div class="slideinput" style="width: 220px; height: 20px; padding-top: 10px; padding-left: 8px;"> 
                <div style="width: 200px;" class="slider"> 
                </div> 
                <input class="slidevalue" id="q36" name="q36" type="hidden" value="0" /> 
            </div> 

        </div> 

        <div class="item"> 
            <p class="head"> 
                Kvaliteta restorana i kafića?</p> 

            <div class="slideinput" style="width: 220px; height: 20px; padding-top: 10px; padding-left: 8px;"> 
                <div style="width: 200px;" class="slider"> 
                </div> 
                <input class="slidevalue" id="q37" name="q37" type="hidden" value="0" /> 
            </div> 

        </div>

Есть решение?

Answer 1

Я не уверен насчет события "slide" - но большинство событий jQuery будут иметь this в качестве целевого элемента.

Вы пытались сделать console.log(this); (при условии, что поджег), чтобы увидеть, что у вас есть?

Вы можете сделать это:

Обновлено с комментарием:

Похоже, ваш элемент ввода является дочерним по отношению к родительскому элементу "ползунков", а не ползунку, изменившему блок кода, чтобы отразить ваш.

slide: function(event, ui) {
  $(this).parent().find("input.slidevalue").val(ui.value);
}