jQuery addClass 到在 Egde 中不起作用的子元素

Question

我有這個結構：

<ul>
  <li class="js-drilldown-back"><a>Back</a></li>
  <li><a href="#">item</a></li>
  <li><a href="#">item</a></li>
  <li><a href="#">item</a></li>
</ul>

我正在嘗試向第一個標簽添加一個類，所以它變成了這樣：

<ul>
  <li class="js-drilldown-back"><a class="click-back">Back<a></li>
  <li><a href="#">item</a></li>
  <li><a href="#">item</a></li>
  <li><a href="#">item</a></li>
</ul>

我使用的框架是動態添加這個后退按鈕，所以我不能手動添加類。 我試過這段代碼：

$(".js-drilldown-back").children("a").addClass("click-back")

但它似乎在 Edge 中不起作用，其他瀏覽器似乎對它很滿意。 我也試過：

$(".js-drilldown-back:has a").addClass("click-back")
$(".js-drilldown-back:has > a").addClass("click-back")
$(".js-drilldown-back a").addClass("click-back")
$(".js-drilldown-back > a").addClass("click-back")

我想要實現的是，當您單擊“后退”按鈕時，它會從 body 標記中刪除一個類，即：

$(".click-back").click(function(){
  $("#page").removeClass("submenu-open")
})

定位父級（.js-drilldown-back）似乎不起作用，這就是為什么我試圖將類添加到子級並改為定位它。

Answer 1

在每個語句之后，您似乎沒有正確的分號終止。

$(".js-drilldown-back").children("a").addClass("click-back");

:first-child 似乎在 Edge 中工作正常，或者 jsfiddle 中的 console.log 可能很寬松？ 我還重新設計了您如何應用您的點擊事件，並確認它會從錨點中刪除該類。

$(".js-drilldown-back:first-child").addClass("click-back");
console.log( $(".js-drilldown-back:first-child").hasClass("click-back") );

$(document).on("click", ".click-back", function(){
  $(this).removeClass("click-back");
})

控制台確認錨具有所需的類，即 :first-child 正在工作。

單擊錨點后，源確認該類已被刪除。 我更改了目標只是為了確認它正在刪除我可以看到和驗證的東西。

所有在 Edge 中測試： https ://jsfiddle.net/8bfo9cza/