在Javascript中获取h:outputText

Get h:outputText in Javascript

本文关键字：outputText 获取 Javascript      更新时间：2023-09-26

我已经在h:outputText中加载了一些信息，但现在我想点击一个按钮并触发一个JS函数，该函数将从outputText中获取该文本。

结构为：

<p:tabView id="tabView">
    <p:tab id="tabInvitator" title="Invitator">
         <h:form id="formInvitator">  
              <h:outputText id="inv" value="#{myController.selectedUsersFB}" />
...

但在JS函数文档中，getElementsById（"tabView:tabInvitator:formInvitator:inv"）不起作用。它重新命名了网络应用程序。

我只想获取这些数据，并在JS函数中对其进行操作
有什么建议吗？

更新：

我已经尝试了BalusC的建议，下面是我的尝试：

   function test(){
            var arr = document.getElementsByName("tabView:tabInvitator:formInvitator:inv");
            console.log(arr);
            console.log('Arr: '+arr);
            console.log('Length: '+arr.length);

第一个日志返回：[]，第二个返回：Arr:[object NodeList]，第三个：长度：0

为什么日志返回不同的内容？现在，如果假设h:outputText中有一个文本，我如何访问该对象NodeList？

我下面回答中的解决方案

首先，我想要更新的是一个唯一的ID，因此JS调用将是：document.getElementById（…）（而不是复数形式-getElementsById），因为我只会从中返回包含值的数据，通常是文本。

按照我的例子，如果我想首先更新outputText，然后在JS函数中获取信息，我可以连续执行，首先更新字段（我把它放在任何标签中），完成后，调用JS函数：

<p:tabView id="tabView">
  <p:tab id="tabInvitator" title="Invitator">
     <h:form id="formInvitator">
         <p:commandButton value="Invite" icon="ui-icon-comment"  update=":inv" oncomplete="sendRequestViaMultiFriendSelectorSelected();"/>
     </h:form>
  </p:tab>
</p:tabView>
<h:outputText id="inv" value="#{myController.selectedUsersFB}" />

和Javascript函数：

function sendRequestViaMultiFriendSelectorSelected() {
          var arr = document.getElementById("inv");
          console.log(arr.childNodes[0]);
          if(arr.childNodes[0]){
              console.log(arr.childNodes[0].data);
          }
          ...
}

希望它能帮助到别人；）

相关文章：