1

我开始为我的网站编写一些 javascript 以创造更好的用户体验，但我对到底发生了什么有点困惑，也许其他人清楚地知道我做错了什么或遗漏了什么。我有两个 javascript 函数，在第一次使用后可以完美运行，如果你慢慢使用它（有时如果你按两个键太快，它会跳过下一个项目并且什么都不选择）。我觉得我缺少某种 $(document).ready(function() {}); 实施以确保每个流程在继续之前完成。我有两个文本框，用户输入两个数字，然后它移动到下一个选项卡元素（下一个文本框）。如果有任何影响，文本框也在 asp.net 更新面板中。

    function selectall(item) {
            $(item).focus().select();
    };

    function selectNext(textBox) {
        if ($(textBox).val().length == 2) {
            $(textBox).next().focus().select();
        }
    };

        <asp:TextBox ID="Text1" runat="server" Width="30px" AutoPostBack="True"  onkeyup="selectNext(this);" onclick="selectall(this);"
    Height="20px"></asp:TextBox>:
                <asp:TextBox ID="Text2" runat="server" Width="30px" AutoPostBack="True" onkeyup="selectNext(this);" onclick="selectall(this);"
    Height="20px"></asp:TextBox>
                 <asp:DropDownList ID="Text2" runat="server"
4

1 回答 1

0

为什么需要在 UpdatePanel 中包含文本框？

您在文本框上设置的 AutoPostback 可能会导致 jQuery 出现问题，因为每当 TextBox 控件失去焦点时都会发生页面回发。

我会将您的文本框从您的 UpdatePanel 中取出，删除 AutoPostback 并将您的 JavaScript 放在document.ready.

编辑

代码片段：

$(document).ready(function() {
    $("#fname").keyup(function() {
        selectNext($(this));
    });

    $("#fname").focus(function() {
        $(this).select();
    });

    $("#lname").keyup(function() {
        selectNext($(this));
    });

    $("#lname").click(function() {
        $(this).select();
    });
});

function selectNext(textBox) {
    if (textBox.val().length == 2) {
        setTimeout(function() {
            textBox.next().focus().select();
        }, 5);
    }
}
于 2012-04-11T07:27:43.580 回答