“pbG62d78562_2d4676_2d4b22_2d96b8_2d227d65ceaa9f_j_id1”之类的ID是从哪里来的？

Question

我正在使用 JavaScript 和 Facelets 页面，

这是我的代码：

<h:head>
    <script type="text/javascript">
        function transfer() {
            alert(editor.getMolfile());
            document.getElementById("strMol").value = editor.getMolfile();

            var newVal=document.getElementById("strMol").value;
            alert("new val"+newVal);
        }
    </script>
</h:head>
<h:body>
    <h:form id="searchMoleculeForm">
        <h:inputHidden name="strMol" id="strMol" value="#{search.strMol}" />
        <rich:panel >
            <f:facet name="header">
                Search The Molecule
            </f:facet>
            <center>
                <div id="editor"></div>
            </center>
            <center>
                <h:commandButton value="substructure" action="#{search.subStructure}" onclick="transfer();" />
                <h:commandButton value="exact_similar" action="#{search.exactSearch}" onclick="transfer();" />
                <h:commandButton value="pharmacophore" action="#{search.pharmacore}" onclick="transfer();" />
                <h:commandButton value="shape" action="#{search.shapeSearch}" onclick="transfer();" />
            </center>
        </rich:panel>
    </h:form>
    <script type='text/JavaScript'>
        var editor = chemwriter.loadEditor('editor');
    </script>
</h:body>

它不起作用，当我查看源代码时，其他带有 id “strMol”的 id 是这样的：

<input id="pbG62d78562_2d4676_2d4b22_2d96b8_2d227d65ceaa9f_j_id1:searchMoleculeForm:strMol" type="hidden"

所以我把那个 ID 放进去

document.getElementById("pbG62d78562_2d4676_2d4b22_2d96b8_2d227d65ceaa9f_j_id1:searchMoleculeForm:strMol") 

它开始工作了..

我的问题是，另一个 ID id 来自哪里？我该如何解决？

Answer 1

我已经通过链接How can I know the id of a JSF component so I can use in Javascript解决了这个问题

我只是放了

 document.getElementById("#{strMol.clientId}").value =  editor.getMolfile();

在这里我在标签内添加绑定

<h:inputHidden id="strMol" value="#{search.strMol}" binding="#{strMol}" />

Answer 2

鉴于我看到了一个<rich:panel> 标签，我假设您使用的是RichFaces，它是JSF 的一个实现。该 id 由框架自动生成。您可以阅读一些关于 here 背后的逻辑。修复这取决于您修复的意思。