0

我的登录页面上有一个按钮，当您单击时，它变得不可见，而不是那个按钮，您会看到一个跨度。代码是：

<script type="text/javascript">
    function enterSystem() {
        document.getElementById("btnLogin").style.display = "none";
        var newtext = document.createTextNode("Wait...");
        document.getElementById("brain13").appendChild(newtext);
    }
</script>

ASP 方面：

<span class="lblMessageLoading" id="brain13" onclick="enterSystem();">
<asp:button class="LoginButton" id="btnLogin" name="btnLogin" runat="server" onclick="btnLogin-Click" /> </span>

所以...问题是每次我单击“等待...”时，它都会不断写入相同文本的新文本。我想知道是否有办法阻止这个问题。感谢您的任何建议。

4

1 回答 1

0

鉴于您的示例代码，最简单的方法是添加一个检查以查看“btnLogin”按钮是否已经不可见，如下所示：

function enterSystem() {
    var loginButton = document.getElementById("btnLogin");
    if (loginButton.style.display !== "none"){
        loginButton.style.display = "none";
        var newtext = document.createTextNode("Wait...");
        document.getElementById("brain13").appendChild(newtext);
    }
}

就个人而言，我更喜欢使用指示文档状态的 css 类，因为这样可以轻松进行测试、调试，并且可以将样式保留在样式表中（并且它可以使用单个状态一次影响多个元素）。

我会将其添加到页面样式表中：

body.loginActive #btnLogin
{
    display: none;
}

然后重写 enterSystem 函数：

function enterSystem()
{
    //  this uses classList which is rather new (http://caniuse.com/classlist)
    //  you may want to rewrite this into a test using a regular expression
    //  e.g. if (/\bloginActive\b/.test(document.body.className))
    if (!document.body.classList.contains('loginActive'))
    {
        //  the classList again, you may want to write this as:
        //  document.body.className += ' loginActive';
        document.body.classList.add('loginActive');
        var newtext = document.createTextNode("Wait...");
        document.getElementById("brain13").appendChild(newtext);
    }
}
于 2013-07-13T12:15:30.343 回答