Javascript onclick hide div
Я хочу скрыть это предупреждение div, используя javascript внутри него.
Я получаю javascript правильно? Я хочу скрыть/закрыть div, когда я нажимаю на значок закрытия (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>
Ответы
Ответ 1
Если вы хотите закрыть его, вы можете либо скрыть его, либо удалить его со страницы. Чтобы скрыть это, вы сделаете несколько 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;
Ответ 2
Простой и лучший способ:
onclick="parentNode.remove()"
Удаляет полный родительский элемент из html
Ответ 3
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';
}
Ответ 4
просто добавьте обработчик onclick для тега привязки
onclick="this.parentNode.style.display = 'none'"
или изменить обработчик onclick для тега img
onclick="this.parentNode.parentNode.style.display = 'none'"