尽管通过id进行了调用，但Javascript无法访问jsf outputText(label）元素

Javascript is unable to access jsf outputText(label) element inspite of calling via id

本文关键字：jsf 访问 outputText 元素 label Javascript id 调用      更新时间：2023-09-26

我试图使用javascript访问jsf outputText值的值，但它抛出了undefined。以下是代码

    <ui:composition template="/template.xhtml">
            <ui:define name="head">
                <script type="text/javascript">
                    function sendDetails()
                    {
                        alert("am inside js");
                        var key=document.getElementById('editForm:key').value;
                        alert(key);
                    }
                </script>
            </ui:define>
    <ui:define name="body">
                <f:view>
                    <h:form id="editForm">
                        <h:outputLabel id="key" value="#{editController.details.clientId}" style="font-weight: bold" >
 <h:commandLink id="analytics" onclick="sendDetails()" value="View"></h:commandLink>
     </h:form>
     </f:view>
     </ui:define>
     </ui:composition>

当我点击命令链接时，它会抛出未定义的！！我无法访问输出标签的值。我检查了firebug 中的查看页面源

<label id="editForm:key" style="font-weight: bold">

1e20bb95-753e-4252-b6d6-e109fa07171e

这似乎是对的。。我检查了console.log(document.getElementById('editForm:key')) console.log(document.getElementById('editForm:key').value)，它显示<label id="editForm:key"> undefined

如何访问label/jsf输出文本值。我需要一个只有javascript的解决方案

您无法使用.value获取h:outputLabel值，因为它被渲染为HTML label标记，而使用.value无法获取h:outputText值，因为其被渲染为HTMLspan标记。

对这两个标记都使用.innerHTML。

你可以用萤火虫找到它的所有属性。将此添加到观看

document.getElementById('editForm:key')

例如，以下是包含其文本的更多属性

.innerHTML
.outerText
.textContent
相关文章：