a元素的事件

最新推荐文章于 2019-05-31 03:37:41 发布

zzxian

最新推荐文章于 2019-05-31 03:37:41 发布

阅读量1k

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/zzxian/article/details/17348131

版权

js 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

先看一段代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <script type="text/javascript" src="Scripts/jquery-1.6.2.min.js"></script>
        <title>testjq</title>
    </head>
    <body>
        <a id="testa" href="http://baidu.com">to foo</a>
        <a id="testb" href="#foo2">to foo2</a>
        <ul>
            <li id="foo2">id</li>
            <li>nothing<br/>is <br/> ok</li>
            <li name="foo">name</li>
        </ul>
    </body>
    <script type="text/javascript">
        $(function () {
            $('#testa,#testb').click(function () {
                alert("click event");
                location.href = "http://www.sina.com.cn";
                alert("end click");
            });
        });
    </script>
</html>

testa链到新的页面，testb链到本页面的一个锚点。

同时为他们加上click事件，其中修改location.href改变url。

结果是，tasta打开了baidu.com，testb打开了sina.com.cn。

一般情况，先执行click事件，再跳转页面。

工作中，为了规避这种情况，一般使用herf=javascript:; 或者herf="#"把控制权全交给click事件。