如何禁用ASP按钮（System.Web.UI.WebControls.Button）的回发(postback)功能

Question

我有一个asp按钮。由于它是服务器端的，所以只能显示给已登录的用户，但我想让它运行一个JavaScript函数。似乎当它的runat="server"时，它总是调用PostBack事件。

我还有一个普通按钮（<input...），它没有运行在服务器端，它可以正常工作...

我该如何使这个按钮仅运行JavaScript而不进行PostBack？

- d1k_is

Answer 1

当 JavaScript 完成任务时，让它返回 false。

<asp:button runat="server".... OnClientClick="myfunction(); return false;" />

- womp

---

许多情况下，人们会使用下面这种语法 <asp:Button OnClientClick="myFunction()" /> 的 onclick 或 OnClientClick，其中 myFunction() 返回 false 并不足够 - 你必须使用 OnClientClick="return myFunction()"。 - Bron Davies

我需要增加 UseSubmitBehavior="False" 和 ;return false。 - rob

请确保添加 'CausesValidation="false"'，否则它会添加 'WebForm_DoPostBackWithOptions' 和一堆额外的标记。 - Carter Medlin

这在ASP.NET 4+中对我无效，但是Konstantin的答案OnClientClick="return false"确实有效。 - TylerH

Answer 2

YourButton.Attributes.Add("onclick", "return false");

或者

<asp:button runat="server" ... OnClientClick="return false" />

- koistya

Answer 3

你可以使用jQuery的点击动作，并使用preventDefault()函数来避免提交表单。

<asp:button ID="btnMyButton" runat="server" Text="MyButton" />


$("#btnMyButton").click(function (e) {
// some actions here
 e.preventDefault();
}

- Rameez

---

这是一个优雅的答案，因为它允许您测试禁用条件。 - John Mott

永远不要使用preventDefault，因为它会停止依赖于此事件的其他事件。 - Piotr Kula

@ppumkin：preventDefault 是告诉其他事件监听器你已经处理了这个事件，所以他们不必再处理的好方法。 我想你想说的是 stopPropagation，它确实可以阻止事件被其他事件监听器听到。 - Sebbas

四年过去了，我更加坚定地支持这个观点。千万不要做那些事情。 - Piotr Kula

@PiotrKula 过了另外四年怎么样？你不能只是说不要那样做。显然对于绝大多数情况来说都没问题。方便是很值得的。 - undefined

直到今天，这个问题仍然存在。这是我在JavaScript中看到的最大的误解。preventDefault就像eval()一样，真是个大坑。 - undefined

Answer 4

考虑一下这个。

<script type="text/javascript">
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequest);
function BeginRequest(sender, e) {
    e.get_postBackElement().disabled = true;

}
     </script>

- Ramakrishnankt

---

给你的回答加上一点更多的背景信息会更好。 - undefined

Answer 5

其他人说得对，你需要让回调函数返回false；但是我想补充一下，通过设置onclick来实现这个功能是一种旧而且不美观的方法。我建议阅读有关非侵入式JavaScript的内容。使用像jQuery这样的库可以使你的生活更轻松，HTML与你的JavaScript解耦（并且jQuery现在被Microsoft支持！）

- Neil Williams

Answer 6

ASP.NET总是将asp:Button生成为input type=submit。如果你想要一个按钮不进行提交，但需要在服务器端控制该元素，请创建一个简单的HTML输入框，并使用属性type=button和runat=server。

如果你通过OnClientClick=return false禁用了点击操作，它将不会在点击时执行任何操作，除非你创建一个函数，例如：

function btnClick() {
    // do stuff
    return false;
}

- A.D.P. Tondolo

Answer 7

在我的情况下，我通过在onClientClick中添加return来解决问题：

后台代码

function verifyField(){
  if (document.getElementById("inputId").checked == "") {
    alert("Fill the field");
    return false;
  }
}

设计界面

<asp:Button runat="server" ID="send" Text="Send" onClientClick="return verifyField()" />

- Raphael

---

如何在此之后运行 OnClick 方法。 - user1773603

Answer 8

此外，对于已接受的答案，您可以使用UseSubmitBehavior="false"。 MSDN

- Arbejdsglæde

---

ASP.NET 在客户端单击脚本的末尾添加了 ;__doPostBack(。 - IvanH

Answer 9

您没有说明使用的.NET框架版本。

如果使用的是2.0或更高版本，则可以使用OnClientClick属性在按钮的onclick事件触发时执行JavaScript函数。

要防止服务器提交，只需从调用的JavaScript函数返回false即可。

- OtisAardvark

Answer 10

使用验证

在这个例子中，我使用了两个控件，ddl 和 txtbox，祝编码愉快。

 asp:ScriptManager ID="script1" runat="server" /asp:ScriptManager

    asp:UpdatePanel ID="Panel1" runat="server"
       ContentTemplate

// ASP BUTTON
asp:Button ID="btnSave" runat="server" Text="Save" class="btn btn-success" OnClientClick="return Valid()" OnClick="btnSave_Click"


   /ContentTemplate    
    /asp:UpdatePanel    

  <script type="text/javascript">
        function Valid() {

            if ($("#ctl00_ContentPlaceHolder1_YOUR CONTROL NAME").val() == 0) {
                alert("Please select YOUR TEXT");
                $("#ctl00_ContentPlaceHolder1_YOUR CONTROL NAME").focus();
                return false;
            }

            if ($("#ctl00_ContentPlaceHolder1_YOUR CONTROL NAME").val().length == 0) {
                alert("Please Type YOUR TEXT");
                $("ctl00_ContentPlaceHolder1_YOUR CONTROL NAME").focus();
                return false;
            }
            return true;
        }
</script>

- Praneeth