2

好吧，我的基本问题是如何在 javascript 中模拟按钮单击。

我知道我必须使用 document.getElementById("btnSubmit").click(); 但这似乎也没有调用 onClientClick javascript函数。

环境：

我正在使用带有 C# 和 javascript 的 ASP.NET。

发生了什么：我有一个输入文本区域，我想确保用户必须在启用提交按钮之前输入一个字符。我可以用 onkeypress="validateTxt();" 做到这一点 然后调用这个函数

 function validateTxt() {
    var input = document.getElementById("<%=txtUserName.ClientID %>").value;
    //Need a min of 3 characters
    if(input.length > 1)
    {
        document.getElementById("btnSubmit").disabled = false;
    }
    else
    {
        document.getElementById("btnSubmit").disabled = true;
    }
}

唯一的问题是没有注册退格键。

为了解决这个问题，我在网上找到了这个

<script type="text/javascript">
       document.getElementsByName('txtUserName')[0].onkeydown = function (event) {
        if (event === undefined) event = window.event; // fix IE 
        if (event.keyCode === 8)
         validateTxt();
        if (event.keyCode === 13) {
            document.getElementById("btnSubmit").click();
        }
        };

现在，每当用户按下退格键时，都会调用我的 javascript 函数。这一直很好，直到我发现当我从文本区域按 Enter 时它不会调用我的 javascript 函数。

这是所有相关的代码...

    <script type="text/javascript">
function InformUser()
{
    window.document.getElementById("loadingMessageDIV").style.display = "block";
   <%=Page.GetPostBackEventReference(btnSubmit as Control)%>
    document.getElementById("btnSubmit").disabled = true;
}

function validateTxt() {
    var input = document.getElementById("<%=txtUserName.ClientID %>").value;
    //Need a min of 3 characters
    if(input.length > 1)
    {
        document.getElementById("btnSubmit").disabled = false;
    }
    else
    {
        document.getElementById("btnSubmit").disabled = true;
    }
}

</script>

这里是文本区域 + javascript 边界功能

<asp:TextBox ID="txtUserName" runat="server" Font-Size="11pt" onkeypress="validateTxt();"></asp:TextBox>
            <script type="text/javascript">
                //We bind the textbox to this function and whenever the backspace key is pressed it will validateTxt
                document.getElementsByName('txtUserName')[0].onkeydown = function (event) {
                    if (event === undefined) event = window.event; // fix IE 
                    if (event.keyCode === 8)
                        validateTxt();
                    if (event.keyCode === 13) {
                        document.getElementById("btnSubmit").click();
                    }
                }; 
            </script>

这是提交按钮

<asp:Button ID="btnSubmit" runat="server" OnClientClick="InformUser();" OnClick="btnSubmit_Click"
                            Text="Login" Font-Bold="True" Enabled="True" />
                        <script type="text/javascript">
//Disable the button until we have some actual input
                            document.getElementById("btnSubmit").disabled = true;
                        </script>

因此，回顾一下它确实按下了按钮，但它也无法禁用它。我什至尝试在用户按下回车键然后按下按钮时直接调用 InformUser，但这也不起作用。

我知道这与我如何将 javascript 函数绑定到文本区域有关，因为当我将其取出时它可以工作。

谢谢您的帮助

4

1 回答 1

0

如果您真正想做的是根据文本区域中的文本量启用/禁用提交按钮，那么每次更改时检查长度是最简单的。

你能使用jQuery吗？如果可以，这是一个微不足道的问题，因为 jQuery 将键盘事件标准化，因此您不必担心不同的浏览器会引发不同的事件。

作为一个简单的实验，我用这个 HTML创建了一个jsFiddle ：

<textarea id="txt"></textarea>
<label id="count" />

和这个JavaScript：

$('#txt').keyup(function () {
    $('#count').text($('#txt').val().length);
});

在每个keyup上（我使用 keyup 而不是 keydown 或 keypress，因为 keyup 在修改文本后触发）长度都会更新。这注册了普通键、退格、删除、回车等，适用于 FF 和 IE8。

在您的情况下，您显然会更改功能以启用/禁用提交按钮。

于 2012-05-22T17:01:22.327 回答