Question

我在页面中有一个更新面板，供用户指定＆＃34;所有者＆＃34;对于一个事件。该所有者将是我们的活动目录中的用户。该面板允许用户输入一些文本，然后单击搜索按钮以在Active Directory中查找匹配的用户。当用户从匹配列表中选择用户时，将填充所有者的姓名和用户名。用户名保持隐藏状态，因为用户无需查看。所有这一切都很好

我的问题是，每当更改所有者名称的文本时，我都会触发一个事件处理程序，如果用户更改了所有者名称，我想将所有者用户名空白，直到用户实际调出匹配列表并选择有效条目。

我的问题是当我尝试使用Javascript访问隐藏文本框的值时，我不能，但是当我尝试jquery等效代码时，它工作得很好。为什么呢？

这是我的Html

<asp:UpdatePanel ID="OwnerUpdatePanel" runat="server" UpdateMode="Conditional" ClientIDMode="Static">
    <ContentTemplate>
        <asp:TextBox id="OwnerNameTextbox" runat="server" class="form-control input-sm" Width="200"/>
        <asp:TextBox id="OwnerUsernameTextbox" runat="server" class="hidden"/>
        <asp:LinkButton class="btn btn-default btn-sm StopClickPropagation" id="GetOwners" AutoPostBack="True" runat="server" OnClientClick="CheckLength()" OnClick="GetMatchingOwners">
            <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
        </asp:LinkButton>
        <asp:ListBox id="OwnersList" runat="server" AutoPostBack="True" class="dropdown-list" onblur='$(".dropdown-list").hide();' OnSelectedIndexChanged="OwnerSelectionChanged">
        </asp:ListBox>
        <p>
    </ContentTemplate>
</asp:UpdatePanel>

这是ownernametextbox更改事件的处理程序

    function OwnerNameTextChanged() {
        document.getElementById("OwnerUpdatePanel").childNodes[1].value = "";
    }

这将我的OwnerNameTextBox设置为空白，这不是我想要的。我想将OwnerUsernameTextbox设置为空白。但是当我将childNodes的下标更改为2时，没有任何改变（用警报检查childNodes [2]的值，给我＆＃34; undefined＆＃34;）。但是，如果我尝试使用jquery：

$("#OwnerUpdatePanel").children(":nth-child(2)").val("");

效果很好。为什么jquery子选择工作，而不是javascript一个？

Answer 1

由于textNode也是childNode，您需要尝试

＆＃13;

document.getElementById("OwnerUpdatePanel").childNodes[3].value = "";

＆＃13;

<div id="OwnerUpdatePanel">      
  <input type="text" id="OwnerNameTextbox" value="name">
  <input type="text" id="OwnerUsernameTextbox" value="user">
</div>

＆＃13;

删除标签之间的间距（摆脱一个子节点）

＆＃13;

document.getElementById("OwnerUpdatePanel").childNodes[2].value = "";

＆＃13;

<div id="OwnerUpdatePanel">      
  <input type="text" id="OwnerNameTextbox" value="name"><input type="text" id="OwnerUsernameTextbox" value="user">
</div>

＆＃13;

来自documentation - childNodes还包括例如文本节点和注释。要跳过它们，请使用children

＆＃13;

document.getElementById("OwnerUpdatePanel").children[1].value = "";

＆＃13;

    <div id="OwnerUpdatePanel">      
      <input type="text" id="OwnerNameTextbox" value="name">
      <input type="text" id="OwnerUsernameTextbox" value="user">
    </div>

＆＃13;

Javascript到空白文本框值不会工作，但jquery做

1 个答案: