Jquery:在jquery spinner值上添加一个类已更改

时间:2017-03-01 16:29:09

标签: jquery spinner

我做了什么:

$( function() {
    var spinner = $( '#spinner' ).spinner({
        min     : -1,
        max     : 1,
        spin    : function( event, ui ) {
            console.log( ui.value );
        }
    });
});

<input id="spinner" name="value">

我想要这个结果:

If spinner value > 1 && spinner selected class == 'ui-spinner-up' addclass this.'active'
If spinner value == 0 removeclass 'active'
If spinner value < 0 && spinner selected class == 'ui-spinner-down' addclass this.'active'

image

有人知道怎么做吗?希望你能理解这个问题。提前谢谢。

2 个答案:

答案 0 :(得分:0)

希望你试图做这样的事情 -

$('#spinner').change(function(){
    var val = $(this).val();
    if(val > 1){
        $(this).addClass('ui-spinner-up');
        $(this).removeClass('ui-spinner-down');
        $(this).addClass('active');
    }else if(val == 0 ){
        $(this).removeClass('active');
    }else{
        $(this).addClass('ui-spinner-down');
        $(this).removeClass('ui-spinner-up');
        $(this).addClass('active');
    }
});

答案 1 :(得分:0)

试试这个:(添加jquery-ui.css,jquery-ui.js,jquery.js)

$( function() {    

    var spinner = $( '#spinner' ).spinner({
        min     : -1,
        max     : 1,
        spin    : function( event, ui ) {
            var val = ui.value;

            if( val > 0 ) {
                $( this ).parent().find( 'a.ui-spinner-up' ).addClass( 'active' ).siblings( '.active' ).removeClass( 'active' );
            } else if( val < 0 ) {
                $( this ).parent().find( 'a.ui-spinner-down' ).addClass( 'active' ).siblings( '.active' ).removeClass( 'active' );
            } else {
                $( this ).parent().find( 'a' ).removeClass( 'active' );
            }

        }
    });

});

<强> HTML:

<input id="spinner" name="value">