用jQuery给css类添加一个整数

Adding a integer to a css class with jQuery

本文关键字：一个 整数 添加 jQuery css      更新时间：2023-09-26

这是我的代码，现在它需要做的是增加类名'icon-'之后的整数，以便每次单击'icon-'类获得更高的整数值，例如单击-> 'icon-2'，单击-> 'icon-3'等等。

请记住，当前显示给用户的图标是"icon-1"。

还有，是否有一种方法可以让我在点击"icon-10"时发出警报，或者防止它试图超越"icon-10"或低于"icon-1"。

    $(function () {
        a = 2,
        b = '',
        $('.icon-step-backward').click(function(){      
            $('#slider').removeClass();
            $('#slider').addClass('icon-' - a);
        });
        $('.icon-step-forward').click(function(){
            $('#slider').removeClass('icon-');
            $('#slider').addClass('icon-' + a);
        });
    });

$('.icon-step-backward, .icon-step-forward').click(function () {
    var s = $(this).hasClass('icon-step-backward') ? -1 : 1;
    $('#slider').prop('className', function (_, p) {
        return p.replace(/'d+/g, function (n) { 
            var j = +n + s;
            return j <= 10 && j >= 1 ? j : n;
        });
    });
});
http://jsfiddle.net/Mwcbp/

$(function () {
    var classes=["icon-1","icon-2","icon-3","icon-4","icon-5","icon-6"
      ,"icon-7","icon-8","icon-9","icon-10"];
    var classCounter=0;
    $('.icon-step-backward, .icon-step-forward').click(function () {
      //caching slider object
      var $slider = $('#slider'),
      s = $(this).hasClass('icon-step-backward') ? -1 : 1,
      tmp=counter+s,
      disableButton=(s==-1)?'.icon-step-backward':'.icon-step-forward',
      enableButton=(s==-1)?'.icon-step-forward':'.icon-step-backward';
      $(enableButton).show();
      if(tmp<classes.length && tmp>0){
         $slider.removeClass(classes[counter]);
         counter=counter+s;
         $slider.addClass(classes[counter]);
      }else{
         $(disableButton).hide();
      }
    });
});

如果你有多个。icon-step按钮必须操作多个滑动条(否则建议使用#slider)，那么你可以添加classCounter作为$("#slider")。

相关文章：