當我擁有的是HTML字符串X時，如何才能找到最接近的元素？

Question

我需要使用onClick(swiper,e)來解決Swiper JS中的鏈接錯誤。

swiper：是對整個刷卡容器
e：是的MouseEvent其中屬性target包含HTML字符串，例如<div class="start-time">16:00</div>

<div class="swiper-container"> 
    <div class="swiper-wrapper"> 
    <div class="swiper-slide">Slide 1</div> 
    <div class="swiper-slide">Slide 2</div> 
    <div class="swiper-slide"> 
     <a href="abc" target="_blank"> 
     <div class="start-time">16:00</div> 
     <div class="flag"><img ...></div> 
     <div class="name col-4">Buritos</div> 
     </a> 
    </div> 
    ... 
    </div> 
</div> 

現在我需要防止默認Swiper行爲，找到鏈接並打開一個新窗口。此代碼不能正常工作，但僞代碼我多麼希望它

onClick: function(swiper, e) { 
     e.preventDefault(); 
     let target = $(e.target); // HTML is now jQuery 
     let slide = target.closest('swiper-slide'); //Not working 
     let link = slide.find('a').attr('href'); 
     window.open(link); 
    }, 

我被困在當用戶點擊幻燈片內的任何元素找到父swiper-slide。我認爲target.closest('swiper-slide')會做的伎倆，但它沒有。

任何幫助非常感謝。

Answer 1

這應該工作：

onClick: function(swiper, e) { 
    e.preventDefault(); 

    var hyperlink = $(e.target).closest('a'); 

    window.open(hyperlink.attr('href')); 
}, 

Answer 2

您可以使用$.parents()遍歷超過從點擊的元素一個級別，並通過選擇來找到你想要這樣的一個：

onClick: function(swiper, e) { 
    e.preventDefault(); 
    let target = $(e.target); // HTML is now jQuery 
    let slide = target.parents('.swiper-slide')[0]; 
    let link = slide.find('a').attr('href'); 
    window.open(link); 
},