使用javascript和amp;设置按钮样式的OnClientClick

Question

我在网页上有一个asp.net按钮。

OnClientClick代码禁用该按钮，以便用户无法多次提交。 它还将按钮的文本更改为“请稍候......”

到目前为止一切都很好！

麻烦的是，因为它被禁用了“请等待......”文字看起来很垃圾...... 我如何设置按钮的样式，以便即使它被禁用，它也会在javascript中启用。

    <script type="text/javascript">
    function btnSubmit_ClientClick(Client) {
        var ok = Page_ClientValidate();
        if (ok) {


            Client.style.color = 'White';
            Client.style.backgroundColor = '#9A4D9E';

            Client.value = 'Please wait...';
            Client.disabled = true;
        }
    }
</script>

开始编辑：

这是启用按钮：

这是禁用的按钮：

...你可以看到文字有点灰白色？

为了进一步说明，@ user503034建议在CSS中使用[disabled]。 这是我的代码，但我仍有同样的问题：

    button[disabled]:active, button[disabled], input[type="reset"][disabled]:active, input[type="reset"][disabled], input[type="button"][disabled]:active, input[type="button"][disabled], select[disabled] > input[type="button"], select[disabled] > input[type="button"]:active, input[type="submit"][disabled]:active, input[type="submit"][disabled]
{
    color: Green;
    background-color: #9A4D9E;
    cursor: default;

}

Answer 1

你可以试试这个

<script type="text/javascript"> 
function btnSubmit_ClientClick(Client) { 
    var ok = Page_ClientValidate(); 
    if (ok) { 


        Client.style.color = 'White'; 
        Client.style.backgroundColor = '#9A4D9E'; 

        Client.value = 'Please wait...'; 
        if (Client.ClassName.indexOf("disabled")>0)
            return false;
        else
            Client.ClassName += " disabled";
    } 
} 

这不会完全禁用该按钮，但它不会让您单击它。现在你可以按照你想要的方式设计它。如果这是表单上的提交按钮，你也可以在表单上执行onSubmit并在那里返回false，以防止有人只是选中并按下回车键。可能不是你想要的，但它确实起到了作用。

如果你想在此之后禁用按钮并设置样式，请使用user503034中的建议进行一次额外更改，而不是仅在CSS中执行[disabled]，输入[disabled =“disabled”]，input.disabled这将适用于所有主流浏览器。

Answer 2

也许that正是您所寻找的。