Изменение jquery.ui.spinner

Я пытаюсь использовать последнюю версию jquery.ui.spinner.js. http://wiki.jqueryui.com/w/page/12138077/Spinner

Прядильщики обнаруживают и обновляют текстовые поля, но мне трудно понять, как записать событие "change". Он запускается при ручном изменении значения в текстовом поле, но не при использовании стрелок-поворот.

JQuery

    $('input[name*="opening"]').spinner({ min: 0, max: 100});

    $('#doorsize6w7h-f').spinner().change(function(){
         alert($(this).spinner('value'));
    });

HTML:

<input type="text" value="0" class="front" id="doorsize6w7h-f" name="opening[0][0]" />

Ответ 1

Прикрепите событие к элементам счетчика, который вызывает change() в вашем текстовом поле.

$('.ui-spinner-button').click(function() {
   $(this).siblings('input').change();
});

jsFiddle.

После настройки счетчика.

Ответ 2

Я думаю, что это то, что вам нужно:

$('.mySpinner').spinner({          
    stop:function(e,ui){
        alert('Triggered after a spin.');
    }
});

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

Подробнее см. на этой странице и других событиях: http://api.jqueryui.com/spinner/#entry-examples

Ответ 3

Нет события "изменения", вместо этого используйте событие "spinstop":

$('#doorsize6w7h-f').on("spinstop", function(){
   alert($(this).spinner('value'));
});

Документация также предлагает событие spinchange, но для меня это немного лаконично.

Ресурс: http://api.jqueryui.com/spinner/?rdfrom=http%3A%2F%2Fdocs.jquery.com%2Fmw%2Findex.php%3Ftitle%3DUI%2FSpinner%2Fspinner%26redirect%3Dno#event-change

Ответ 4

Ну, на самом деле я бы перенаправлял изменения через стандартное событие "change" и записывал все, например:

$('input[name*="opening"]').spinner({
    min: 0,
    max: 100,
    spin: function(event, ui) {
        $(this).change();
    }
});

Ответ 5

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

Кроме того, вручную отредактируйте значение и с помощью кнопки со стрелкой, можно также отредактировать значение счетчика с помощью кнопки со стрелкой на клавиатуре. В этом случае я считаю, что событие keyup более надежное, чем событие изменения:

$(document).ready(function(){
    var range_spinner = $('.spinner').spinner(); 

    // hack to trigger input keyup whenever spinner button clicked:
    $('.ui-spinner-button').click(function() { $(this).siblings('input').keyup(); });   

    // keyup will catch any stroke on keyboard
    $('#range').keyup(function(){
       console.log(range_spinner.spinner('value')); 
    });
});

Ответ 6

Это дает мне самые плохие результаты:

function betterSpinner(input)
{
    input.spinner(
    {
        spin: function(event, ui)
        {
            // the spin event is raised before the value actually gets changed,
            // so let update it here before raising the input change() event.
            input.val(ui.value);
            input.change();
        }
    });
}

$(document).ready(function ()
{
    betterSpinner($("#myInput"));
});