javascript .focus() 使用选项卡进行操作答案

【问题标题】：javascript .focus() to operate with tabjavascript .focus() 使用选项卡进行操作
【发布时间】：2011-06-10 19:48:08
【问题描述】：

由于某种原因，我的 setfocus() 事件都没有在我的 Web 应用程序的服务器端运行，因此我创建了一个 JavaScript 函数 setfocus，它设置为在 body 标签的 onload 事件上触发。

<body onload="SetFocus()">

用户将单击启用下拉菜单的单选按钮。他们从启用文本框的下拉菜单中选择。当他们将条形码扫描到文本框中时，它会自动跳出该字段，因此触发onchange 事件以调用一些服务器端代码，如果成功完成 SQL 插入，则会将新行插入到 gridview 中，并且它应该通过 Javascript 自动将焦点设置回文本框。一旦该 gridview 对象具有多个标题和一行数据，我将禁用下拉列表和单选按钮列表，因此如果您查看下面的 Javascript，我不能再将它们用作 if 语句中的条件。

Javascript：

 var MatAllRB = document.getElementById("HF_RB_MatAll").value;
 var MatAllCL = document.getElementById("DD_SelectCL_All").value;
 var MatAll = document.getElementById("Txt_MatBC_All");
 var MatAllPrompt = document.getElementById("HF_AllPrompt").value;
 var count = $("#GV_Scan_All tr").children().length;

这很好用：

else if (ActiveTab == "cont-3" && MatAllRB != "" && MatAllCL != "")
    {   alert("went into setfocus");
        document.getElementById("Txt_MatBC_All").focus();
        alert("made it through setfocus");
    }

这仅在您实际单击该字段时才有效，该选项卡不起作用。它什么也不做。

else if (ActiveTab == "cont-3" && count == 9)
    {   alert("went into setfocus");
        document.getElementById("Txt_MatBC_All").focus();
        alert("made it through setfocus");
    }

这和上面做的一样：

else if (ActiveTab == "cont-3" && (MatAllPrompt == "RP" || MatAllPrompt == "P03"))
    {   alert("went into setfocus");
        document.getElementById("Txt_MatBC_All").focus();
        alert("made it through setfocus");
    }

奇怪的是，我在这里看到的所有这些警报都正确显示，只是从来没有设置焦点。我对这些东西还是很陌生，所以也许我遗漏了一些东西，但我不明白为什么focus() 将用于点击而不是点击。任何帮助将不胜感激。

这是 HTML：

    <asp:RadioButtonList runat="server" ID="RB_Mat_All" AutoPostBack="true" RepeatColumns="4" OnSelectedIndexChanged="RB_Mat_All_OnSelectedIndexChange">
    <asp:ListItem Text="NC" value="NC"></asp:ListItem>
    <asp:ListItem Text="DA" value="DA"></asp:ListItem>
    <asp:ListItem Text="GW" value="GW"></asp:ListItem>
    <asp:ListItem Text="PC" value="PC"></asp:ListItem>
</asp:RadioButtonList>
<asp:HiddenField runat="server" ID="HF_RB_MatAll"></asp:HiddenField >
<br />
<asp:DropDownList runat="server" ID="DD_SelectCL_All" AutoPostBack="true" OnSelectedIndexChanged="DD_SelectCL_All_OnSelectedIndexChange">
    <asp:ListItem Value="" Text="Select..."></asp:ListItem>
    <asp:ListItem value="53" text="05"></asp:ListItem>
    <asp:ListItem value="54" text="06"></asp:ListItem>
    <asp:ListItem value="55" text="07"></asp:ListItem>
    <asp:ListItem value="57" text="08"></asp:ListItem>
    <asp:ListItem value="58" text="09"></asp:ListItem>
</asp:DropDownList>
<asp:label runat="server" ID="Lbl_All_Prompt" CssClass="Form" Text=""></asp:label>
<asp:HiddenField runat="server" ID="HF_AllPrompt"></asp:HiddenField >
<asp:TextBox runat="server" ID="Txt_MatBC_All" Cssclass="Form" Text="" AutoPostBack="true" OnTextChanged="Txt_MatBC_All_TextChanged"></asp:TextBox>
<asp:GridView runat="server" ID="GV_Scan_All" CssClass="Form_Feedback"></asp:GridView>

当我查看源代码时，文本框如下所示：

<input name="Txt_MatBC_All" type="text" onchange="javascript:setTimeout(&#39;__doPostBack(\&#39;Txt_MatBC_All\&#39;,\&#39;\&#39;)&#39;, 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" id="Txt_MatBC_All" class="Form" />

【问题讨论】：

您尝试过的所有浏览器中的行为是否相同？
我只试过 ie，但这是我们在这里唯一被允许使用的浏览器...傻，我知道。

标签： javascript asp.net textbox focus dom-events

【解决方案1】：

很奇怪，您可以单击关闭该字段并且它可以工作，但选项卡关闭却没有。尝试将 tabIndexes 添加到页面上的输入中。

【讨论】：

是的，这完全有效……但我不得不这样做仍然很奇怪。非常感谢您的帮助！

【解决方案2】：

文本框的 id，在 asp.net 呈现页面时更改。所以试试这个动态获取 id 并查看它是否有效。

document.getElementById("<%=Txt_MatBC_All.ClientID%>").focus();

您必须在使用的每个 getElementById 上使用 ClientID。

顺便说一句，在每一行上，您都关注同一个文本控件 (Txt_MatBC_All)。如果是这种情况，为什么要这样做，只使用一行。

提示 1：您可以通过让 teamporary 像 alert(document.getElementById("<%=Txt_MatBC_All.ClientID%>")); 这样的警报调用来查看您的 getElementById 是否找到了控件
提示 2：右键单击浏览器并查看页面的源代码，以查看您的控件采用了哪些 id，看看您是否真的正确，并且与您使用的 javascript 相同。李>

【讨论】：

感谢您的提示。源代码中的 ID 是正确的。我尝试使用您上面建议的代码，但它没有做任何不同的事情。我将所有关注同一个控件的代码分开来简化我的问题，在代码中它都是一行。

【解决方案3】：

尝试将您的 JavaScript 转换为方括号表示法。例如：document.forms[0].Txt_MatBC_All.focus();

【讨论】：