我有一个弹出屏幕，用于向我们的系统添加付款。在这个页面中是一个使用DIV的手工制作的标签控件。我要做的是当用户单击选项卡，加载选项卡并将焦点设置在选项卡中的事务控件上。我有管理选项卡控件的java脚本。
我要做的是在“按钮”选项卡的OnClick事件上切换到选项卡并将焦点设置在“交易ID”文本框上。
以下是该页面的精简版本：
<asp:Content runat="server" ContentPlaceHolderID="ContentPlaceHolder1">
<div style="width: 100%; height: 32px; padding-top: 4px; padding-left: 4px;">
<div class="Property StackPanelItem-Left">
<div class="PropertyLabel" id="divPaymentTypeLabel" runat="server">
Select payment type:
</div>
</div>
<div class="Property StackPanelItem-Left">
<asp:DropDownList ID="ddlPaymentType" runat="server" TabIndex="1"
Width="150px" AutoPostBack="true"
DataTextField="PAYMENT_TYPE_DESC" DataValueField="PAYMENT_TYPE"
OnSelectedIndexChanged="ddlPaymentType_SelectedIndexChanged">
</asp:DropDownList>
</div>
</div>
<div id="tabControl1" class="Region-TabControl" style="height: calc(100% - 80px);">
<div id="tabControl1.TabButtons-Breadcrumbs" class="Region-Header-TabControl Region-Header-Color-Silver" style="text-shadow: none !important;">
<div id="tabButton.PayeeInfo" class="Breadcrumb Breadcrumb-Normal" onclick="SetPayeeInfoFocus()" >
<div class="Breadcrumb-Text">
Payee Info
</div>
</div>
<div id="tabButton.PayeeContact" class="Breadcrumb Breadcrumb-Normal" >
<div class="Breadcrumb-Text">
Payee Contact
</div>
</div>
<div id="tabButton.PayeeAddress" class="Breadcrumb Breadcrumb-Normal" >
<div class="Breadcrumb-Text">
Payee Address
</div>
</div>
<div id="tabButton.PayeeBank" class="Breadcrumb Breadcrumb-Normal" >
<div class="Breadcrumb-Text">
Payee Bank
</div>
</div>
<div id="tabButton.PaymentInfo" class="Breadcrumb Breadcrumb-Normal" onclick="SetEnterScreenFocus()" >
<div class="Breadcrumb-Text">
Payment Info
</div>
</div>
<div id="tabButton.Review" class="Breadcrumb Breadcrumb-Normal" >
<div class="Breadcrumb-Text">
Review
</div>
</div>
</div>
<div id="tabControl1.Panel" class="Region-Content-TabControl" style="height: calc(100% - 40px);">
<div id="tabPanel.PayeeInfo" class="TabPanel">
</div>
<div id="tabPanel.PayeeContact" class="TabPanel" style="height: calc(100% - 8px);">
<div class="PropertyLabel" style="font-size: 16px; width: calc(100% - 20px); height: 32px; margin: 4px">
Select or add payee contact:
</div>
<uc1:PayeeContacts runat="server" ID="PayeeContact" GridHeight="calc(100% - 36px)" />
</div>
<div id="tabPanel.PayeeAddress" class="TabPanel" style="height: calc(100% - 8px);">
<div class="PropertyLabel" style="font-size: 16px; width: calc(100% - 20px); height: 32px; margin: 4px">
Select or add payee address:
</div>
<uc1:PayeeAddresses runat="server" ID="PayeeAddress" GridHeight="calc(100% - 36px)" />
</div>
<div id="tabPanel.PayeeBank" class="TabPanel" style="height: calc(100% - 8px);">
<div class="PropertyLabel" style="font-size: 16px; width: calc(100% - 20px); height: 32px; margin: 4px">
Select or add payee bank:
</div>
<uc1:PayeeBanks runat="server" ID="PayeeBank" GridHeight="calc(100% - 36px)" />
</div>
<div id="tabPanel.PaymentInfo" class="TabPanel">
<div class="PropertyLabel" id="divEnterPaymentInfoHeader" runat="server" style="font-size: 16px; border-bottom: 1px solid #000; width: calc(100% - 20px); height: 32px; margin: 4px">
Enter your payment information:
</div>
<div style="padding-top: 4px; padding-left: 4px; height: 52px; width: 100%;">
<div class="Property StackPanelItem-Left">
<div class="PropertyLabel">
Transaction ID
</div>
<asp:TextBox ID="txtEnterTransactionID" Width="175" MaxLength="20" TabIndex="2" CssClass="PropertyTextBox" runat="server"/>
</div>
<div class="Property StackPanelItem-Left">
<div class="PropertyLabel">
Account Number with Payee
</div>
<asp:TextBox ID="txtEnterAccountNumber" MaxLength="22" Width="175" TabIndex="3" CssClass="PropertyTextBox" runat="server"/>
</div>
<div class="Property StackPanelItem-Left" id="divEnterPaymentInfo_CheckNumber" runat="server">
<div class="PropertyLabel">
Check Number
</div>
<asp:TextBox ID="txtEnterCheckNumber" MaxLength="15" TabIndex="4" CssClass="PropertyTextBox" runat="server"/>
</div>
</div>
</div>
<div id="tabPanel.Review" class="TabPanel">
</div>
</div>
</div>
<div style="width: 100%; height: 32px; padding-top: 4px; padding-left: 4px;">
<div class="Property StackPanelItem-Right">
<asp:Button ID="btnBack" Text="Back" runat="server"/>
<asp:Button ID="btnNext" Text="Next" runat="server"/>
</div>
</div>
</asp:Content>
这是我正在使用的jquery：
function SetEnterScreenFocus（）{
document.getElementById("ContentPlaceHolder1_txtEnterDRCTransactionID").focus();
}
此时我正在使用测试，因为我正在尝试验证元素是否已加载。
jquery找到对象，但焦点不起作用。我在这里缺少什么？
提前致谢。
答案 0 :(得分：0)
Ok发现问题 - 这是一个时间问题。这就是我解决它的方法：
function SetEnterScreenFocus() {
$('tabPanel.PaymentInfo').show();
setTimeout(function () { document.getElementById('ContentPlaceHolder1_txtEnterTransactionID').focus(); }, 10);
}
作品 - 不确定此处是否还有其他问题。