2012-08-07 74 views
0

我有这个功能,一切都很好,bur我不能再次启动它。只能这样做一次,有什么不对? Thx寻求帮助。如何重新启动功能?

$('.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'); 
    }); 
}); 
+0

绑定使用相同的元素和函数内的同一事件的另一个功能看起来怪怪的,是哟你确定你不只是在寻找[toggle()](http://api.jquery.com/toggle/)或应该使用一个标志。 – adeneo 2012-08-07 12:34:43

回答

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'); 
     } 
    }); 
+0

不错,它的工作,很多thx,chears! – Lukas 2012-08-07 12:42:29

0

变化onelive

$('.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'); 
    }); 
}); 
+0

'.live()'函数现在已被弃用了2年。 – Pointy 2012-08-07 12:28:57

+0

好的,我试过这个,但是第二个动作是不行的 – Lukas 2012-08-07 12:29:59

2

您使用功能.one()代替.on()(或.delegate(),中老年的jQuery版本.live()/.bind())。

+0

所以,我需要解除这个功能? – Lukas 2012-08-07 12:30:52

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'); 
    } 
}); 
+0

是的,这是非常简单的方法,thx – Lukas 2012-08-07 12:45:16

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); 
});​ 
+0

这是很好的方式,但我需要添加一些其他行动,以这两个条件,我想我需要设置更多的扩展条目 – Lukas 2012-08-07 12:53:33