javascript - 为什么没有触发超链接上的点击事件?

标签 javascript jquery asp.net-mvc asp.net-mvc-3

为什么没有触发超链接上的点击事件?

@Html.ActionLink(
    "Show the privacy policy", 
    "PrivacyPolicy", 
    null, 
    new { id = "privacyLink" })

<div id="privacy"></div> 

<script> 
    $(document).ready(function () {

        // $('div').addClass('fooh');
        $('div#myDiv').click(function () {
            alert('div was clicked');
        });
        $('a#privacyLink').click(function () {
            alert('a');
        });
    });
</script>

myDiv 点击事件按预期触发,但 privacyLink 事件未触发,即未显示警报。

生成的 HTML:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Home Page</title>
    <link href="/Content/Site.css" rel="stylesheet" type="text/css" />
    <script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
    <script src="/Scripts/modernizr-1.7.min.js" type="text/javascript"></script>
    <script src="/Scripts/AjaxDemo.js" type="text/javascript"></script>
</head>
<body>
    <div class="page">
        <header>
            <div id="title">
                <h1>My MVC Application</h1>
            </div>
            <div id="logindisplay">
                    [ <a href="/Account/LogOn">Log On</a> ]

            </div>
            <nav>
                <ul id="menu">
                    <li><a href="/">Home</a></li>
                    <li><a href="/Home/About">About</a></li>
                </ul>
            </nav>
        </header>
        <section id="main">
            <h2>Welcome to ASP.NET MVC!</h2>
<p>
    To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>.
</p>
<div id="myDiv">
<p>
Me Gusta
</p>
</div>




<a href="/Home/PrivacyPolicy" id="privacyLink">Show the privacy policy</a>


<div id="privacy"></div> 



<script>

    $(document).ready(function () {

        // $('div').addClass('fooh');
        $('div#myDiv').click(function () {

            alert('div was clicked');
        });

        $('a#privacyLink').click(function (e) {
            e.preventDefault();
            alert('a');
            $(location).src = $(this).attr('href');
        });

    });



</script>
        </section>
        <footer>
        </footer>
    </div>
</body>
</html>

最佳答案

除了您应该从 anchor 的点击回调中返回 false 以防止浏览器重定向之外,我没有发现任何问题:

$('a#privacyLink').click(function () {
    alert('a');
    return false;
});

还要确保您的 DOM 中的任何位置都没有带有 id="privacyLink" 的其他元素,因为 ID 必须是唯一的。

同时在浏览器中检查您的 js 控制台,以确保您没有一些 javascript 错误阻止正确附加 .click 处理程序。

关于javascript - 为什么没有触发超链接上的点击事件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15188508/

相关文章:

javascript - 在sequelize where查询中使用OR语句

jquery - 如何从另一个弹出窗口打开一个弹出窗口? -jquery

javascript - 使用定义的模式生成多个动态 ID 的函数

javascript - Moment JS 解析整个 JSON 数组并格式化多个日期实例

c# - 如何限制对 MVC5 中某些操作的访问?

asp.net-mvc - 如何修复 System.Net.Sockets.SocketException

javascript - 以 5 分钟间隔对数组进行排序,并具有唯一值计数

javascript - ionic /javascript : text with < a > tag can't be clicked in the HTML

javascript - setTimeout无故启动且无法停止

jquery - 更改 fancyBox 媒体的外观?