禁用。在jQuery中的锚点上单击功能

Question

这是用jQuery的外部.js编写的...

我有两个窗口，可以滑入和流出视图：

$(document).ready(function() {
  // hides gallery1 as soon as the DOM is ready  
  $('#gallery1').hide();  
  // shows the menu on click   
  $('#showgal1').click(function() {  
    $('#gallery1').delay(490).show('slide', {direction:'left'});
    $('#gallery2').hide('slide', {direction:'right'});
    //need code to disable showgal1 and enable showgal2
  });
  $('#showgal2').click(function() {  
    $('#gallery2').delay(490).show('slide', {direction:'right'});
    $('#gallery1').hide('slide', {direction:'left'});
    //need code to disable showgal2 and enable showgal1
  });
});

“ Gallery1”和“ Gallery2”是Div的Flash Image Galleries和“ ShowGal1”和“ ShowGal2”是锚的ID ...

好像

<a href="#" id="showgal1">gallery 1</a>

当单击一个并重新启用另一个时，我找不到禁用.click函数的方法...

我想默认情况下禁用'showgal1'，并且当发生“ showgal2”事件时，它会删除属性并使“ showgal2”禁用，直到单击“ showgal1” ...

这 .attr('disabled','disabled') 尚未工作...

Answer 1

因此，您想停止任何动作 showgal 如果关联的画廊已经可见，是否可以单击？

$('#showgal1').click(function(){
    if($('#gallery1').is(":visible"))
       return false;

    $('#gallery1').delay(490).show('slide', {direction:'right'});
    $('#gallery2').hide('slide', {direction:'left'});

});

$('#showgal2').click(function(){
    if($('#gallery2').is(":visible"))
       return false;
    $('#gallery2').delay(490).show('slide', {direction:'right'});
    $('#gallery1').hide('slide', {direction:'left'});

});

每条前2行 click 如果相应的画廊已经可见，功能将停止功能。

Answer 2

尝试这个：

.attr('onclick','void(0)');

Answer 3

您也可以在代码中保留一个变量，以跟踪该变量可见 div 姓名。如果您需要更多面板，这将使将来扩展变得更加容易。只需将当前可见的名称存储在变量中，并确保单击项目为 不是 在做任何事情之前。

Answer 4

我不确定我是否完全理解您的问题，但我认为您是否想防止链接触发点击处理程序，如果显示了画廊。

我将使用jQuery的数据功能将画廊的活动状态存储为true/false：

$('#showgal1').click(function() {
    var $gal1 = $(this), $gal2 = $('#gallery2');
    if(!$('#gallery1').data('active')){
        $gal1.delay(490).show('slide', {direction:'left'}).data('active', true);
        $gal2.hide('slide', {direction:'right'}).data('active', false);
    }
});

Answer 5

单击链接时，您可以将“禁用”类“禁用”添加。请注意，这不会自行禁用链接，也不会在您尝试过时设置禁用属性，因为只能禁用输入和按钮之类的元素。但是，您可以检查单击处理程序是否有班级，如果是，则什么也不做：

$("#showgal1").hide();
$("#showgal2").addClass("disabled");

// shows the menu on click   
$('#showgal1').click(function() {  
   if ($(this).hasClass("disabled")) return false;

   // Note the extra .addClass or .removeClass on the end
   $('#gallery1').delay(490).show('slide', {direction:'left'}).addClass("disabled");
   $('#gallery2').hide('slide', {direction:'right'}).removeClass("disabled");
});
$('#showgal2').click(function() {  
   if ($(this).hasClass("disabled")) return false

   $('#gallery2').delay(490).show('slide', {direction:'right'}).addClass("disabled");
   $('#gallery1').hide('slide', {direction:'left'}).removeClass("disabled");
});

添加类的优点是，您可以使用CSS将其外观显示为禁用按钮：

.disabled {
   color: grey;
}