有没有一种方法可以从<a>链接

Is there a way to access a containing div from an <a> link in Javascript?

本文关键字：lt 链接 gt 方法 一种 有没有      更新时间：2023-09-26

我想做的是单击div中的图像链接，并使包含图像链接的div消失（display:none；）。现在我的html有以下结构

<div id="one">
    <div>
        Words Words Words
        <a href="javascript:void(0);" onClick="hideDiv('#one')";>
            <img src="foo.jpg" />
        </a>
    </div>
</div>
<div id="two">
    <div>
        Words Words Words
        <a href="javascript:void(0);" onClick="hideDiv('#two')";>
            <img src="foo.jpg" />
        </a>
    </div>
</div>

hideDiv（）函数如下所示：

function hideDiv(divId) {
    $(divId).hide();
}

这很好用，但可能有点麻烦。我更希望的是，不需要通过id明确定义我想要隐藏的div，也不需要让Javascript捕捉链接点击事件并执行类似$(this_link.parent_div.parent.div).hide();的操作。不幸的是，我不知道该怎么做，但我相信一定有办法！

与其有一个包含div的id，不如有一个公共类，然后使用它。

HTML

<div class="container">
    <div>
        Words Words Words
        <a href="javascript:void(0);">
            <img src="foo.jpg" />
        </a>
    </div>
</div>

Js

$('a').click(function(){
      $(this).closest('.container').hide();
});

如果你不想添加任何类，那么你可以简单地尝试一下。

$('a').click(function(){
      $(this).parent().parent().hide();
});

工作演示-http://jsfiddle.net/ShankarSangoli/MvkEa/

参考文献：

  • .closest()-http://api.jquery.com/closest/
  • .parent()-http://api.jquery.com/parent/

一个很好的方法是向要选择的所有div添加一个新类：

<div id="one" class="linkDiv">

然后执行：

$(this).parents('.linkDiv').hide();

这个解决方案不会让你依赖于在你的链接和你想要隐藏的容器之间总是有两个级别的div。

使用parent()方法获取元素的父级。

<script type="text/javascript">
function hideDiv(a) {
    $(a).parent().parent().hide();
}
</script>
<div id="two">
    <div>
        Words Words Words
        <a href="javascript:void(0);" onClick="hideDiv(this)";>
            <img src="foo.jpg" />
        </a>
    </div>
</div>

或者，不引人注目地：

<script type="text/javascript">
$(document).ready(function(){
  $(".hideable a").click(function(){
    $(this).parents(".hidable").hide()
  });
});
</script>
<div class="hideable">
    <div>
        Words Words Words
        <a href="javascript:void(0);">
            <img src="foo.jpg" />
        </a>
    </div>
</div>

我想你想要.parent()

http://api.jquery.com/parent/

我每天都有jquery文档页面，这对于这些类型的问题来说是一个令人难以置信的资源。

http://docs.jquery.com/Main_Page

相关文章：