草庐IT

Javascript 到空白文本框值不会工作,但 jquery 确实

coder 2023-08-10 原文

我在页面中有一个更新面板,供用户指定事件的“所有者”。该所有者将是我们事件目录中的用户。该面板允许用户输入一些文本,然后单击搜索按钮以在我们的 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>

这是所有者名称文本框更改事件的处理程序

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

这将我的 OwnerNameTextBox 设置为空白,这不是我想要的。我想将 OwnerUsernameTextbox 设置为空白。但是当我将 childNodes 的下标更改为 2 时,什么都没有改变(检查 childNodes[2] 的值并发出警报,给我“未定义”)。但是如果我尝试使用 jquery:

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

效果很好。为什么 jquery 子选择有效,而 javascript 无效?

最佳答案

因为textNode也是一个childNode,你需要尝试

document.getElementById("OwnerUpdatePanel").childNodes[3].value = "";
<div id="OwnerUpdatePanel">      
  <input type="text" id="OwnerNameTextbox" value="name">
  <input type="text" id="OwnerUsernameTextbox" value="user">
</div>

去掉标签之间的间距(去掉一个子节点)

document.getElementById("OwnerUpdatePanel").childNodes[2].value = "";
<div id="OwnerUpdatePanel">      
  <input type="text" id="OwnerNameTextbox" value="name"><input type="text" id="OwnerUsernameTextbox" value="user">
</div>

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

document.getElementById("OwnerUpdatePanel").children[1].value = "";
    <div id="OwnerUpdatePanel">      
      <input type="text" id="OwnerNameTextbox" value="name">
      <input type="text" id="OwnerUsernameTextbox" value="user">
    </div>

关于Javascript 到空白文本框值不会工作,但 jquery 确实,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34027106/

有关Javascript 到空白文本框值不会工作,但 jquery 确实的更多相关文章

  1. ruby-on-rails - 由于 "wkhtmltopdf",PDFKIT 显然无法正常工作 - 2

    我在从html页面生成PDF时遇到问题。我正在使用PDFkit。在安装它的过程中,我注意到我需要wkhtmltopdf。所以我也安装了它。我做了PDFkit的文档所说的一切......现在我在尝试加载PDF时遇到了这个错误。这里是错误:commandfailed:"/usr/local/bin/wkhtmltopdf""--margin-right""0.75in""--page-size""Letter""--margin-top""0.75in""--margin-bottom""0.75in""--encoding""UTF-8""--margin-left""0.75in""-

  2. ruby-on-rails - 'compass watch' 是如何工作的/它是如何与 rails 一起使用的 - 2

    我在我的项目目录中完成了compasscreate.和compassinitrails。几个问题:我已将我的.sass文件放在public/stylesheets中。这是放置它们的正确位置吗?当我运行compasswatch时,它不会自动编译这些.sass文件。我必须手动指定文件:compasswatchpublic/stylesheets/myfile.sass等。如何让它自动运行?文件ie.css、print.css和screen.css已放在stylesheets/compiled。如何在编译后不让它们重新出现的情况下删除它们?我自己编译的.sass文件编译成compiled/t

  3. ruby - 使用 ruby​​ 将 HTML 转换为纯文本并维护结构/格式 - 2

    我想将html转换为纯文本。不过,我不想只删除标签,我想智能地保留尽可能多的格式。为插入换行符标签,检测段落并格式化它们等。输入非常简单,通常是格式良好的html(不是整个文档,只是一堆内容,通常没有anchor或图像)。我可以将几个正则表达式放在一起,让我达到80%,但我认为可能有一些现有的解决方案更智能。 最佳答案 首先,不要尝试为此使用正则表达式。很有可能你会想出一个脆弱/脆弱的解决方案,它会随着HTML的变化而崩溃,或者很难管理和维护。您可以使用Nokogiri快速解析HTML并提取文本:require'nokogiri'h

  4. ruby - Highline 询问方法不会使用同一行 - 2

    设置:狂欢ruby1.9.2高线(1.6.13)描述:我已经相当习惯在其他一些项目中使用highline,但已经有几个月没有使用它了。现在,在Ruby1.9.2上全新安装时,它似乎不允许在同一行回答提示。所以以前我会看到类似的东西:require"highline/import"ask"Whatisyourfavoritecolor?"并得到:Whatisyourfavoritecolor?|现在我看到类似的东西:Whatisyourfavoritecolor?|竖线(|)符号是我的终端光标。知道为什么会发生这种变化吗? 最佳答案

  5. ruby - 无法让 RSpec 工作—— 'require' : cannot load such file - 2

    我花了三天的时间用头撞墙,试图弄清楚为什么简单的“rake”不能通过我的规范文件。如果您遇到这种情况:任何文件夹路径中都不要有空格!。严重地。事实上,从现在开始,您命名的任何内容都没有空格。这是我的控制台输出:(在/Users/*****/Desktop/LearningRuby/learn_ruby)$rake/Users/*******/Desktop/LearningRuby/learn_ruby/00_hello/hello_spec.rb:116:in`require':cannotloadsuchfile--hello(LoadError) 最佳

  6. ruby-on-rails - 项目升级后 Pow 不会更改 ruby​​ 版本 - 2

    我在我的Rails项目中使用Pow和powifygem。现在我尝试升级我的ruby​​版本(从1.9.3到2.0.0,我使用RVM)当我切换ruby​​版本、安装所有gem依赖项时,我通过运行railss并访问localhost:3000确保该应用程序正常运行以前,我通过使用pow访问http://my_app.dev来浏览我的应用程序。升级后,由于错误Bundler::RubyVersionMismatch:YourRubyversionis1.9.3,butyourGemfilespecified2.0.0,此url不起作用我尝试过的:重新创建pow应用程序重启pow服务器更新战俘

  7. ruby-on-rails - rspec should have_select ('cars' , :options => ['volvo' , 'saab' ] 不工作 - 2

    关闭。这个问题需要detailsorclarity.它目前不接受答案。想改进这个问题吗?通过editingthispost添加细节并澄清问题.关闭8年前。Improvethisquestion在首页我有:汽车:VolvoSaabMercedesAudistatic_pages_spec.rb中的测试代码:it"shouldhavetherightselect"dovisithome_pathit{shouldhave_select('cars',:options=>['volvo','saab','mercedes','audi'])}end响应是rspec./spec/request

  8. ruby-on-rails - s3_direct_upload 在生产服务器中不工作 - 2

    在Rails4.0.2中,我使用s3_direct_upload和aws-sdkgems直接为s3存储桶上传文件。在开发环境中它工作正常,但在生产环境中它会抛出如下错误,ActionView::Template::Error(noimplicitconversionofnilintoString)在View中,create_cv_url,:id=>"s3_uploader",:key=>"cv_uploads/{unique_id}/${filename}",:key_starts_with=>"cv_uploads/",:callback_param=>"cv[direct_uplo

  9. jquery - 我的 jquery AJAX POST 请求无需发送 Authenticity Token (Rails) - 2

    rails中是否有任何规定允许站点的所有AJAXPOST请求在没有authenticity_token的情况下通过?我有一个调用Controller方法的JqueryPOSTajax调用,但我没有在其中放置任何真实性代码,但调用成功。我的ApplicationController确实有'request_forgery_protection'并且我已经改变了config.action_controller.consider_all_requests_local在我的environments/development.rb中为false我还搜索了我的代码以确保我没有重载ajaxSend来发送

  10. ruby - JetBrains RubyMine 3.2.4 调试器不工作 - 2

    使用Ruby1.9.2运行IDE提示说需要gemruby​​-debug-base19x并提供安装它。但是,在尝试安装它时会显示消息Failedtoinstallgems.Followinggemswerenotinstalled:C:/ProgramFiles(x86)/JetBrains/RubyMine3.2.4/rb/gems/ruby-debug-base19x-0.11.30.pre2.gem:Errorinstallingruby-debug-base19x-0.11.30.pre2.gem:The'linecache19'nativegemrequiresinstall

随机推荐