jquery为每个类查找href属性的click事件

Question

我是 jquery 新手。 我正在尝试查找目标元素的“href”属性。

我为每个“链接重定向”类的点击事件编写了一个脚本。在此尝试使用 data-target 属性为目标元素选择 href。

但是通过使用我的脚本，我总是获得第一个 div 的 href，即“link1”。

我在这里做错了什么？

<div class="link-redirect" data-target=".title-link">
    <div cass="div1">
        <a href="link1" class="title-link">LInk</a>
    </div>
</div>
<div class="link-redirect" data-target=".title-link">
    <div cass="div1">
        <a href="link2" class="title-link">LInk</a>
    </div>
</div>
<div class="link-redirect" data-target=".title-link">
    <div cass="div1">
        <a href="link3" class="title-link">LInk</a>
    </div>
</div>
<div class="link-redirect" data-target=".title-link">
    <div cass="div1">
        <a href="link4" class="title-link">LInk</a>
    </div>
</div>

<script>
    $('.link-redirect').each(function(){
        $(this).on( "click", function() {
            var self = $(this);
            var link = $(self.data('target')).attr('href');           
            alert(link);           
        });
    });
</script>

Answer 1

您需要找到相对于当前link-redirect元素的 anchor 元素(在本例中为后代)

$('.link-redirect').on("click", function () {
    var self = $(this);
    var link = self.find(self.data('target')).attr('href');
    alert(link);
});

演示:Fiddle