0

我有这个功能，一切都很好，但我无法再次启动它。只能这样做一次，有什么问题吗？谢谢帮助。

$('.bottom_panel_button_05').one('click', function(){
    $(this).css(
        'background-image','url("img/bottom_panel_icons/ap_bottom_panel_back_button_01_135_on.png")',
        'background-position','center center no-repeat'
    ).addClass('panel_blocked');
    $(this).one('click', function(){
        $(this).css(
            'background-image','url("img/bottom_panel_icons/ap_bottom_panel_back_button_01_135.png")',
            'background-position','center center no-repeat'
        ).removeClass('panel_blocked');
    });
});
4

5 回答 5

2

您正在使用函数.one()而不是.on()（或.delegate(), .live()/.bind()在较旧的 jQuery 版本中）。

于 2012-08-07T12:26:55.933 回答
1 
    $('.bottom_panel_button_05').on('click', function(){
      if (!$(this).hasClass('panel_blocked')) {
        $(this).css({
          'background-image': 'url("img/bottom_panel_icons/ap_bottom_panel_back_button_01_135_on.png")',
          'background-position': 'center center no-repeat'
        }).addClass('panel_blocked');
      } else {
        $(this).css({
          'background-image': 'url("img/bottom_panel_icons/ap_bottom_panel_back_button_01_135.png")',
          'background-position': 'center center no-repeat'
        }).removeClass('panel_blocked');
      }
    });
于 2012-08-07T12:39:31.010 回答
1

看起来您正在尝试切换按钮，在这种情况下您可以简化代码：

$('.bottom_panel_button_05').on('click', function (){
    var that = $(this);
    if (that.hasClass('panel_blocked') {
        that.css(
            'background-image','url("img/bottom_panel_icons/ap_bottom_panel_back_button_01_135.png")'
        ).removeClass('panel_blocked');
    } else {
        that.css(
            'background-image','url("img/bottom_panel_icons/ap_bottom_panel_back_button_01_135_on.png")'
        ).addClass('panel_blocked');
    }
});
于 2012-08-07T12:43:29.227 回答
1

您真正要做的就是切换'_on'到图像名称的末尾并根据元素是否具有该类来切换一个类，一种简单的方法是：

$('.bottom_panel_button_05').on('click', function (){
    var Is = $(this).is('.panel_blocked');
    $(this).css('background-image','url("img/bottom_panel_icons/ap_bottom_panel_back_button_01_135'+(Is?'':'_on')+'.png")')
           .toggleClass('panel_blocked', !Is);
});​
于 2012-08-07T12:48:24.530 回答
0

更改one为live

$('.bottom_panel_button_05').live('click', function(){
    $(this).css(
        'background-image','url("img/bottom_panel_icons/ap_bottom_panel_back_button_01_135_on.png")',
        'background-position','center center no-repeat'
    ).addClass('panel_blocked');
    $(this).live('click', function(){
        $(this).css(
            'background-image','url("img/bottom_panel_icons/ap_bottom_panel_back_button_01_135.png")',
            'background-position','center center no-repeat'
        ).removeClass('panel_blocked');
    });
});
于 2012-08-07T12:26:40.733 回答