Javascript onclick隐藏div

我想隐藏这个使用javascript里面的警告div。Javascript onclick隐藏div

我是我越来越JavaScript的权利？我想隐藏/关闭div时我如果你想关闭它，你可以隐藏或将其从页面删除它的关闭图标点击（图片/ 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>

来源

2011-04-01 karto

完整的父母你使用像jQuery或生的JavaScript库？ – alexl 2011-04-01 15:36:24

。要隐藏它，你会做一些类似的JavaScript：

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

要删除它，你使用removeChild

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

如果你有像jQuery库包含的则隐藏或移除DIV会稍微容易：

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

另外一件事，因为你的img处于锚点，锚点上的onclick事件也将触发。由于href设置为＃，页面将滚动回页面的顶部。一般来说这是很好的做法，如果你想有一个环节做的比去其href其他东西，你应该设置onclick事件return false;

来源

2011-04-01 15:37:43

+1，但他在'img'上有'onclick'，而不是'a'，所以这将是'this.parentNode.parentNode.style.display ='none';'和类似的'this.parentNode。 parentNode.parentNode.removeChild（this.parentNode.parentNode）;'。除非你推荐移动它。 :-) – 2011-04-01 15:57:03

公平点，我在编辑之前误读了这个问题。无论如何，如果这个事件仍然在主播上，那会更好。 – 2011-04-01 15:59:44

同意，这也是我的建议。 – 2011-04-01 16:01:58

只需添加onclick处理锚标签

onclick="this.parentNode.style.display = 'none'"

或更改onclick处理程序为img标签

onclick="this.parentNode.parentNode.style.display = 'none'"

来源

2011-04-01 15:37:43 Andrei

HTML

<div id='hideme'><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="hide('hideme')" /></a

的Javascript：

function hide(obj) { 

    var el = document.getElementById(obj); 

     el.style.display = 'none'; 

}

来源

2011-04-01 15:39:23

谢谢朋友。这也工作。 – karto 2011-04-02 17:59:14

嗨，克里斯。谢谢你。我有一个查询，有没有什么办法可以给它添加一个“过渡效果”？通过转换，我的意思是，'hideme'div将以2秒的线性样式关闭，就像那样。再次感谢！ – 2013-04-02 10:18:52

当然，你可以设置元素溢出：使用JavaScript隐藏，然后使用超时或setinterval，然后可以减少div的高度，直到它达到0.然而，使用JQuery .animate（）这个效果会更容易。 – 2013-06-12 18:29:25

简单&最好的办法：

onclick="parentNode.remove()"

删除从HTML

来源

2013-09-27 16:24:33

Javascript onclick隐藏div

回答

相关问题