点击事件未在使用 Html.ActionLink 生成的链接上触发答案

【问题标题】：Click event not firing on link generated with Html.ActionLink点击事件未在使用 Html.ActionLink 生成的链接上触发
【发布时间】：2016-02-18 18:49:24
【问题描述】：

我有一个 ActionLink 如下：

@Html.ActionLink("-Pg", "SupprimerPage", "Section", 
new { pageId = @item.Id }, new { @id = "ConfirmDeletePage", @class = "editLink", style 
= "width:30px" })

还有我的脚本：

  $(document).ready(function () {
    $(document).on('click', '#ConfirmDeletePage', function () {
        var x=confirm("Confirm delete page?");
        console.log(x);
        if (x == true){
            return true;
        }
        else {
            return false;
        }
    });
});

当我使用带有<a> 标签的硬编码链接时，它可以正常工作。但是当我尝试使用Html.ActionLink 生成链接时，不会调用事件处理程序。有什么帮助吗？

【问题讨论】：

$("...").click(function () { }) not working的可能重复
在浏览器中查看生成的HTML源码，检查ID是否正确注入。
@TrueBlueAussie：ID 已检查并且正确。
另请注意：附加到 document 的委托事件不需要 DOM 就绪处理程序，因为 document 始终存在（不是错误，只是说明）:)
什么是 HTML？相同的id 是否在任何地方重复使用？

标签： javascript jquery asp.net

【解决方案1】：

对于您的问题“当我单击是时，未调用 ActionLink 中的方法”，这是因为您在是按钮上返回是，所以在执行您的函数后，它会跟随链接“href”，这就是为什么它似乎是该方法在 ActionLink 中没有被调用，只需返回 false 或在 true 部分内使用event.preventDefault();，该部分在按下是按钮时运行

     $(document).ready(function () {
        $(document).on('click', '.editLink', function (event) {
            var x=confirm("Confirm delete page?");
            console.log(x);
            if (x == true){
     
              return true;
    
            }
            else {
                alert('Pressed NO')
                return false;
            }
        });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<a href="http://hello.com" class="editLink" >Click me !</a>

更多信息请关注anchor-tag-with-javascript-onclick-event

【讨论】：

我不明白为什么在这两种情况下我都应该返回 false。这样做可以防止对话框一次又一次地弹出。
return false in not 是为了防止对话框一次又一次地弹出，这是为了停止操作链接跟随它的 url，并且您可以在单击是按钮时运行一些 JavaScript，
好的。但是我想要方法，也就是点击OK时的动作链接跟随url。如果我单击取消或关闭对话框，则不应调用该方法。
简单的 return true 会起作用，你只需要使用 class 而不是 id （因为你的 id 不是唯一的），我已经更新了我的代码，请看一下
不，这也不起作用。对话框打开。我单击“确定”，再次重新加载对话框并且未调用该方法。我点击取消，对话框被重新加载并且方法再次没有被调用。

【解决方案2】：

如果它与硬编码链接一起工作，但在您使用 ActionLink 时不能，这意味着 ActionLink 必须生成与硬编码链接不同的东西，这意味着您的 jQuery 选择器 (#ConfirmDeletePage) 没有找到该元素。

您可以通过使用浏览器的开发人员工具检查 ActionLink 生成的 <a... 标记来确认这一点。

基于Html.ActionLink with a specified HTML id 的问题，您可能需要将@id = "ConfirmDeletePage" 更改为id = "ConfirmDeletePage"。

【讨论】：