Javascript onclick hide div [英] Javascript onclick hide div

问题描述

我想在其中使用javascript隐藏此警告div。

I want to hide this warning div using javascript inside it.

我正在使用javascript吗？我想在我点击关闭图标时隐藏/关闭div（images / close_icon.gif）

I'm i getting the javascript right? I want to hide/close the div when i click on the close icon (images/close_icon.gif)

<div>
  <strong>Warning:</strong>
  These are new products
  <a href='#' class='close_notification' title='Click to Close'>
    <img src="images/close_icon.gif" width="6" height="6" alt="Close" onClick="this.close" />
  </a
</div>

推荐答案

如果要关闭它，可以隐藏它或从页面中删除它。要隐藏它你会做一些像这样的javascript：

If you want to close it you can either hide it or remove it from the page. To hide it you would do some javascript like:

this.parentNode.style.display = 'none';

要删除它，请使用 removeChild

this.parentNode.parentNode.removeChild(this.parentNode);

如果你有一个像jQuery这样的库，那么隐藏或删除div会稍微容易一些：

If you had a library like jQuery included then hiding or removing the div would be slightly easier:

$(this).parent().hide();
$(this).parent().remove();

另一件事，因为你的 img 是在一个锚点上，锚点上的onclick事件也会被触发。由于 href 设置为＃，页面将滚动回页面顶部。通常情况下，如果您希望链接执行除 href 以外的其他操作，则应将onclick事件设置为 return false;

One other thing, as your img is in an anchor the onclick event on the anchor is going to fire as well. As the href is set to # then the page will scroll back to the top of the page. Generally it is good practice that if you want a link to do something other than go to its href you should set the onclick event to return false;

这篇关于Javascript onclick hide div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！