JQ数据目标（a）链接对此进行切换； 防止电子

Question

嗨，我让JQuery Toggle div起作用了，我将其设置为导航面板，并且需要阻止用户再次单击同一链接，因为这会将div保留为空白。 我想我只是试图钩住选定的数据目标（a）链接并禁用点击动作或防止争论，仅在此选定目标上。 干杯

这是我的代码：

$('.home').css({
    display: 'visible'
});

$('.contact').css({
    display: 'none'
});

var $targets = $('.target');

$('.navBtn').click(function () {
  var $target = $($(this).data('target')).fadeToggle('slow');
  $targets.not($target).fadeOut('slow');
});

和html：

<a class="navBtn" data-target=".home">
  <img src="img/icons/home.svg" width="100%" />
</a>
<a class="navBtn" data-target=".contact">
  <img src="assets/img/icons/message.svg" width="100%" />
</a>

Answer 1

如果只需要显示元素而不进行切换，请使用.fadeIn()

$('.navBtn').click(function () {
  var $target = $($(this).data('target')).fadeIn('slow');
  $targets.not($target).fadeOut('slow');
});

小提琴