使用 jQuery 启用/禁用 .NET 4.0 按钮答案

【问题标题】：Enable/Disable a .NET 4.0 button with jQuery使用 jQuery 启用/禁用 .NET 4.0 按钮
【发布时间】：2012-10-11 08:10:10
【问题描述】：

我正在尝试使用 jQuery 启用 .net LinkButton，但在 .NET 4.0 中情况发生了一些变化，仅使用 attr("disabled", "disabled") 或 removeAttr("disabled") 将不起作用。

这是按钮。

<asp:LinkButton ID="LinkButtonContinue" runat="server" Text="Continue" CssClass="button continue" Enabled="false"></asp:LinkButton>

呈现如下：

<a class="aspNetDisabled button continue" id="ContentPlaceHolder1_LinkButtonContinue">Continue</a>

注意新添加的 aspNetDisabled 类。

所以我尝试了这个：

jQuery(".continue").removeAttr("disabled").removeClass("aspNetDisabled");

还有这个：

jQuery(".continue").removeClass("aspNetDisabled");

因为没有要移除的 disabled 属性所以我假设它使用 JS 来禁用它？

我将如何使用此类启用按钮？

有什么想法吗？

非常感谢

克里斯

【问题讨论】：

试试这个：$('.continue').attr("disabled", true);

标签： jquery asp.net .net

【解决方案1】：

我认为问题是，当您有一个生成服务器端的按钮时，页面会在其上添加一些 javascript 废话，例如：

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['aspnetForm'];
if (!theForm) {
    theForm = document.aspnetForm;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>

按钮会有类似的东西 javascript:__doPostBack('id','')在href上

我认为您应该尝试在服务器端手动定义此 href 值（或在页面加载时使用 javascript 动态定义，使用生成的可怕 id 可能更容易）。

在您的实例中，没有 href 因此即使未禁用锚点也不会发生任何事情。

编辑： 避免禁用按钮服务器端并在页面加载时使用 javascript 禁用它不仅更容易吗？

【讨论】：

我正在假设您想要进行回发，在这种情况下您需要手动提交表单。您可能需要也可能不需要定义 javascript 来提交此表单，具体取决于您的页面上是否有任何其他启用服务器端的按钮。
基本上，服务器提供的页面有一个最初禁用的提交按钮。用户成功完成该部分后，该按钮将变为启用状态，用户可以单击该按钮进行进度。
我想说只启用按钮服务器端，并在页面加载时在客户端禁用它。或者，如上所述，确保您的页面具有通过 javascript 调用可怕的回发方法的 href 属性。如果您启用了 asp 按钮，则该 javascript 代码会自动添加到页面中，但如果您没有启用，则需要在标记中手动添加它。有意义吗？

【解决方案2】：

也许这对你有用：

$('.continue').disabled = false;

也可以使用的另一种方式是：

$('.continue').attr("disabled", "");

【讨论】：

根据我的回答下方的 cmets，您可以看到我们已经尝试过了。
第一个 sn-p 的过失，但没有提到第二个 sn-p，所以我认为它可能有用

【解决方案3】：

仅使用：

$('.continue').removeClass("aspNetDisabled");

我猜应该可以工作

【讨论】：

感谢您的快速响应。我已经尝试过了，但即使删除了该类，该按钮仍然处于禁用状态。
我也猜测 javascript 会禁用该按钮。您是否尝试过添加 enabled="true" 或 disabled="false" 的属性？我不知道它是否会工作。只是分享我的想法

【解决方案4】：

试试这样的..

<head id="Head1" runat="server">
    <title></title>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>

    <style type="text/css">
        .disabled-link
        {
            color: Gray;
            cursor: default;
        }
    </style>

    <script type="text/javascript">

        $(function() {
            var linkButton1 = $('.continue'); // $('#<%= LinkButton1.ClientID %>')
            var href = linkButton1.attr('href');
            $('#<%= EnableButton.ClientID %>').click(function(e) {
                e.preventDefault();
                linkButton1.attr('href', linkButton1.attr('myCustomAttr')).removeClass('disabled-link');
            });

            $('#<%= DisableButton.ClientID %>').click(function(e) {
                e.preventDefault();
                linkButton1.attr('href', '#').attr('myCustomAttr', href).addClass('disabled-link');

            });
        });

    </script>

</head>
<body>
    <form id="form1" runat="server">
    <asp:LinkButton ID="LinkButton1" runat="server"  CssClass="button continue" PostBackUrl="test.aspx">LinkButton</asp:LinkButton>
    <br />
    <asp:Button ID="DisableButton" runat="server" Text="Disable" />
    <asp:Button ID="EnableButton" runat="server" Text="Enable" />
    </form>
</body>

【讨论】：

谢谢，但你的方法需要我使用 2 个按钮来完成 1 的工作。我相信一定有办法。
按钮只是为了显示功能..您总是可以在客户端使用一些状态变量来切换行为？