`href`中的内联JavaScript在Firefox中无法正常工作

Question

`href`中的内联JavaScript在Firefox中无法正常工作

为什么这个内联javascript不能在Firefox中运行？我怎样才能让它在Firefox中正常工作？

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <style>
        h2 {display:inline; padding:0px 7px 0px;}
        h2 a {text-decoration:none}
        h2 a:link {color:#FFFFFF;} 
        h2#s0 {background-color:black;}
    </style>
</head>
<body>
    <h2 id="s0"><a href="javascript:document.getElementById('d0').style.display='block';">
Click me!</a></h2> 
    <div id="d0"
style="width:98%;border: 5px solid #000000;padding:3px; display:none;">
When you click the heading, this text should appear with a black
outline, with no gap between that and the heading background.</div>
</body>
</html>

Run Code Online (Sandbox Code Playgroud)

在Safari中,这应该是它应该出现的.在Firefox中它暂时出现间隙(好像浏览器处于怪癖模式),然后页面上的所有内容都消失,取而代之的是"块".起初我认为这意味着Firefox阻止它,但它说"内联",而不是如果我设置的样式显示.

编辑:我的问题的Javascript部分现在解决了.但是标题背景的显示方式仍然存在差异:它在Safari中向下延伸到div边界,但在Firefox中则不然.有没有办法让它在Firefox中这样做？

Answer 1

Ale*_* K. 9

你所拥有的最接近的工作形式是:

<a href="javascript:void(document.getElementById('d0').style.display='block');">

Run Code Online (Sandbox Code Playgroud)

因为:

当浏览器跟随javascript:URI时,它会评估URI中的代码,然后用返回的值替换页面的内容,除非返回的值是undefined.该void操作可用于返回undefined.

onclick 这是更好的选择.

Answer 2

Ath*_*ace 3

在 OSX firefox 版本 41.0.1 上，我在 fiddle 中也遇到了同样的问题。我不知道为什么它不起作用，这可能是 FireFox 中的一个错误，但您可以这样做以获得有点类似的工作解决方案：

<a href="#" onclick="document.getElementById('d0').style.display='block';">

Run Code Online (Sandbox Code Playgroud)

归档时间：	10 年，2 月前
查看次数：	2489 次
最近记录：	10 年，2 月前