Visual Studio 2022 ASP.NET：如何在文本框中设置焦点时的光标位置？

问题描述 投票：0回答：1

我正在使用 Visual Studio 2022 和 ASP.NET Webforms 应用程序。

我有一个链接到 

ajaxToolkit:MaskedEditExtender
的文本框。

如果用户从上一个控件切换到文本框，并且文本框为空，则光标位于最后一个“/”的左侧。

如果用户从上一个控件切换到文本框，并且文本框已填充，则光标位于左侧。

当文本框已填充时，如何使光标定位在左侧；当焦点设置为空时，如何使光标定位在左侧，但如果用户在控件上单击鼠标左键来定位光标，则如何使光标定位在左侧？

<asp:Label ID="lbJob_Number" runat="server" Text="Job Number:"></asp:Label>
<asp:TextBox ID="tbJob_Number" runat="server" Width="80px" AutoPostBack="True" ></asp:TextBox>
<ajaxToolkit:MaskedEditExtender ID="meeJob_Number" runat="server" 
     BehaviorID="meeJob_Number" CultureAMPMPlaceholder="" 
     CultureCurrencySymbolPlaceholder=""
     CultureDateFormat="" CultureDatePlaceholder="" 
     CultureDecimalPlaceholder="" CultureThousandsPlaceholder="" 
     CultureTimePlaceholder=""
     TargetControlID="tbJob_Number" 
     Mask="99/9999/???" MaskType="Number" ClearMaskOnLostFocus="false" />

<asp:Label ID="lbJob_Name" runat="server" Text="Job Name:"></asp:Label>
<asp:Label ID="lbJob_Name_Display" runat="server"></asp:Label>
<asp:Label ID="lbEstimating_Job_Number" runat="server" Text="Est Job No:" Visible="False"></asp:Label>

<asp:TextBox ID="tbEstimating_Job_Number" runat="server" Width="80px" AutoPostBack="True"></asp:TextBox>
<ajaxToolkit:MaskedEditExtender ID="meeEstimating_Job_Number" 
     runat="server" BehaviorID="meeEstimating_Job_Number" 
     CultureAMPMPlaceholder="" CultureCurrencySymbolPlaceholder="" 
     CultureDateFormat="" CultureDatePlaceholder="" 
     CultureDecimalPlaceholder="" CultureThousandsPlaceholder="" CultureTimePlaceholder="" 
     TargetControlID="tbEstimating_Job_Number" 
     Mask="99/9999/???" MaskType="Number" ClearMaskOnLostFocus = "false"/>

<asp:Label ID="lbEstimating_Job_Name" runat="server" Text="Est Job Name:" Visible="False"></asp:Label>
<asp:TextBox ID="tbEstimating_Job_Name" runat="server" Enabled="False" Visible="False" Width="300px" MaxLength="30"></asp:TextBox>

谢谢

asp.net webforms visual-studio-2022 ajaxcontroltoolkit
1个回答
0
投票

您可以使用

obj.selectionStart = obj.selectionEnd = position;
来移动光标，其中
obj
是您的
TextBox
，
position
是您要移动到的位置。

在下面的代码中，假设光标位于

tbJob_Number
处，按
Tab
切换焦点位置，可以发现
tbEstimating_Job_Number
的焦点位于文本的最左侧。当用户直接用鼠标指定光标位置时，
onfocus
不会影响鼠标选择的光标位置。

<head runat="server">
    <title></title>
    <script>
        function movePosition(obj,position) {
            obj.focus();
            obj.selectionStart = obj.selectionEnd = position;

        }

        function SetFocusPosition() {
            var element = document.getElementById("tbEstimating_Job_Number")
            movePosition(element,0)
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:Label ID="lbJob_Number" runat="server" Text="Job Number:"></asp:Label>
            <asp:TextBox ID="tbJob_Number" runat="server" Width="80px" AutoPostBack="True"  Text="AAAA"></asp:TextBox>


            <asp:Label ID="lbJob_Name" runat="server" Text="Job Name:"></asp:Label>
            <asp:TextBox ID="tbEstimating_Job_Number" runat="server" Width="80px" AutoPostBack="True" Text="BBBB" onfocus="SetFocusPosition()" ></asp:TextBox>
        </div>
    </form>
</body>

您可以根据自己的需要进行调整。

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.