防止链接按钮回发 OnClientClick 不起作用。为什么？答案

【问题标题】：Prevent LinkButton post back OnClientClick not working. Why?防止链接按钮回发 OnClientClick 不起作用。为什么？
【发布时间】：2013-05-23 09:44:25
【问题描述】：

我知道围绕这个主题有很多答案，但我就是无法让它发挥作用。

我需要阻止返回链接按钮，但以下代码不起作用。代码肯定在所有需要的地方都被命中了。

链接按钮定义：

  <asp:LinkButton ID="NavHelp" OnClientClick="showConfirm(event);" OnClick="NavHelp_Click" ToolTip="Help" runat="server"></asp:LinkButton>

Javascript 函数（肯定会被命中）

function showConfirm(event) {
  event.stopPropagation();
  return false;
}

但是在showConfirm 返回 false 后，链接按钮仍会回发到服务器端 NavHelp 方法。

作为旁注，我还在 .NET 生成的 __doPostback 方法中设置了一个断点，并且在 showConfirm 返回 false 后它确实会被命中。

任何人都可以对此有所了解吗？

【问题讨论】：

标签： javascript asp.net

【解决方案1】：

好吧，想通了。我需要在 OnClientClick 属性中包含 return 语句：

OnClientClick="return showConfirm(event);"

不是

OnClientClick="showConfirm(event);"

【讨论】：

【解决方案2】：

顺便说一句，您可以使用您的原始代码，但您可以使用event.preventDefault()，而不是使用event.stopPropagation()

所以你的代码是

<asp:LinkButton ID="NavHelp" OnClientClick="showConfirm(event);" OnClick="NavHelp_Click" ToolTip="Help" runat="server"></asp:LinkButton>

function showConfirm(event) {
  event.preventDefault();
  return false;
}

阅读更多关于 event.preventDefault() 与 event.stopPropagation() 的内容这里：http://davidwalsh.name/javascript-events

基本上 preventDefault 会阻止元素执行其默认操作，即访问链接或提交表单，而 stoppropagation 允许发生默认操作，但不会通知任何父元素它已经发生。

我创建了一个小 jsfiddle：http://jsfiddle.net/XgSXr/，它向您显示了阻止默认值，这应该允许您在成功推动链接点击之前放入自己的 javascript 逻辑、显示模式等。

【讨论】：

这当然不适合我。再说一次，返回 false 似乎也不起作用。

【解决方案3】：

这行得通：

<asp:LinkButton ID="NavHelp" ClientIDMode="Static" OnClientClick="showConfirm(event);" OnClick="NavHelp_Click" ToolTip="Help" runat="server"></asp:LinkButton>
<script>
    $("#NavHelp").click(function(event) {
        if (showConfirm()) {
            event.stopPropagation();
            event.preventDefault();
            return false;
        }
        return true;
    });
</script>

【讨论】：

【解决方案4】：

在onClientClick Javascript Event中添加return语句

OnClientClick="return showConfirm(event);"

所以当 showConfirm 返回 false 时，请求不会传输到服务器，页面不会回发。

【讨论】：