Javascript onclick脚本

joh*_*ohn 4 javascript onclick hyperlink

好的我是javascript的新手,但是我想调用一个onclick函数而不在锚标签上添加onclick ="function()".这是我的脚本,但我不能让它工作:

<script type="text/javascript">
function clicka() {
 alert("hi");
}
document.getElementById('click').onclick = clicka;
</script>

<a href="#" id="click">click</a>
Run Code Online (Sandbox Code Playgroud)

当我点击链接时,它应该提醒"嗨",任何想法?

Mic*_*Mic 6

将SCRIPT标记放在A标记之后.浏览器按顺序解析标记,并且在解析SCRIPT标记时A仍然不存在.

其他一些评论也是:

  • 你可以转储 type="text/javascript"
  • 您可以设置href ="javascript:void(0)"以避免在单击时污染哈希键
  • 或者你return false;的onclick功能


Tat*_*nen 5

将脚本放在a标记之后或将脚本包装在window.onload函数中。其中任何一个都可以工作:

<script type="text/javascript">
window.onload = function() {
    function clicka() {
        alert("hi");
        return false;
    }
    document.getElementById('click').onclick = clicka;
}
</script>
<a href="#" id="click">click</a>
Run Code Online (Sandbox Code Playgroud)

或者:

<a href="#" id="click">click</a>
<script type="text/javascript">    
function clicka() {
    alert("hi");
    return false;
}
document.getElementById('click').onclick = clicka;
</script>
Run Code Online (Sandbox Code Playgroud)

它不起作用的原因是您在标签存在a之前对a标签的点击事件进行了绑定;因此它没有找到任何元素,也不会做任何事情。

通过将脚本放入其中,window.onload您可以指示浏览器仅在页面中的所有元素都加载完毕并且可以找到该元素后才运行脚本。

为了防止浏览器实际重定向到#,您可以return false从您的 clicka 功能,正如我在上面标记的那样。