javascript - 单击时在相同功能中包含可选类

所以基本上我有这个脚本

$(document).ready(function() {
  $("body").on("click", ".submenu-ctn .submenu-who nav a", function(e) {
    e.preventDefault();
    var url = $(this).attr('data-url') + ' #' + $(this).attr('data-target');
    $('.tile-area-main').load(url);
  });
});

和html的相应代码段，以便您可以看到层次结构...

<header class='masthead'>
  <div class='brand-container'>
    <a class='slide' href='#' data-url='who-are-musability-music-therapy.html' data-target='overview'>
      <span class='brand-initials'>Who Are Musability?</span>
      <span><i class="fa fa-briefcase brand-initials-icon"></i></span>
    </a>
  </div>
  <nav>
    <div class='nav-container'>
      <div>
        <a class='slide' href='#' data-url='who-are-musability-music-therapy.html' data-target='mission'>
          <span class='element'>Mission and Values</span>
        </a>
      </div>

我基本上也想在同一函数的头文件中包含内置的a href ...

当前，该功能仅在导航后查看所有内容。如何在此实例中包括所有类？

最佳答案

您可以选择所有带有幻灯片作为类别的标签。像这样

$(document).ready(function(){
  $("body").on("click", ".slide", function(e){ <------- .slide
    e.preventDefault();
    var url = $(this).attr('data-url') + ' #' + $(this).attr('data-target');
    $('.tile-area-main').load(url);
  });
});