jQuery 单独切换多个元素的函数

Question

html代码

<div>
<span class="share-start-url"><i class="fa fa-fw fa-link">test</i></span>
<div class="share-url" style="float: none;">http://impactne.ws/1OzGim8</div>
</div>

<div>
<span class="share-start-url"><i class="fa fa-fw fa-link">test</i></span>
<div class="share-url" style="float: none;">http://impactne.ws/1OzpL12</div>
</div>

jQuery代码

jQuery(document).on("click", ".share-start-url", function(e){
    jQuery(".share-url").toggleClass("share-swipe");
    jQuery(".fa-link").toggleClass("share-back-highlighted");
    e.stopPropagation();
});

目前，当用户点击第一个 class 时，它会打开所有元素，而不是单独打开。我该如何解决？

Answer 1

使用DOM遍历只切换相同DIV:

中的元素

$(document).on("click", ".share-start-url", function(e) {
    var thisDiv = $(this).closest("div");
    thisDiv.find(".share-url").toggleClass("share-swipe");
    thisDiv.find(".fa-link").toggleClass("share-back-highlighted");
    e.stopPropagation();
});

jQuery 单独切换多个元素的函数

jQuery function to toggle multiple elements individually

jquery

click

toggleclass