显示：无;在浏览器中显示“无”

This jsFiddle example works in Google Chrome, but in Internet Explorer then when the close icon is clicked the browser removes the pop-up element but results in the text 'none' being displayed in the browser window. Please explain how I can resolve this issue.

此jsFiddle示例适用于Google Chrome，但在Internet Explorer中，当单击关闭图标时，浏览器会删除弹出元素，但会在浏览器窗口中显示文本“无”。请解释我如何解决这个问题。

HTML:

HTML：

<div id="popup">
    <!-- Close popup link -->
    <a href="javascript:document.getElementById('popup').style.display='none';">X</a>
</div>

3 个解决方案

#1

Use onclick for the event handler instead of href http://jsfiddle.net/AE2X3/4/

使用onclick为事件处理程序而不是href http://jsfiddle.net/AE2X3/4/

<div id="popup">
        <a href="#" onclick="document.getElementById('popup').style.display='none';return false;" id="close_popup"></a>
        <p>This is a pop-up.</p>
</div>

#2

I think what's happening is that the assignment is returning its result, and the browser is then displaying that. If you add void(0) to the end of your JavaScript, it won't be displayed.

我认为正在发生的是分配返回其结果，然后浏览器显示它。如果将void（0）添加到JavaScript的末尾，则不会显示它。

Let me add that amit_g's answer is more correct than mine. He correctly points out that this sort of behaviour belongs in the OnClick handler, not in the href attribute.

让我补充一点，amit_g的答案比我的更正确。他正确指出这种行为属于OnClick处理程序，而不属于href属性。

#3

This works:

这有效：

<div id="popup">
        <a href="javascript:void(0);" onclick="this.parentElement.style.display='none';" id="close_popup"></a>
        <p>This is a pop-up.</p>
</div>

Demo

演示

#1