Javascript 引用动态primefaces accordionPanel或dataGrid中包含的元素

这个问题是针对accordionPanel的，但我相信可以询问类似的动态渲染器，比如dataGrid

我想在每个手风琴标签上的画布上画画。与此类似

使用此accorionPanel：

<form id="someForm">
<p:accordionPanel id="accordion" value="#{dataModel.values}" var="value">
    <p:tab id="entry" title="Entry - #{value}">
        <div id="layout">

            <canvas id="canvas" width="300" height="200">
            </canvas>

            <div id="foo" class="foo">#{value.data1}</div>
            <div id="bar" class="bar">#{value.data2}</div>
        </div>
    </p:tab>
</p:accordionPanel>
<p:remoteCommand name="updateAccordion" update="accordion"/>
</form>

#{value.data1}
#{value.data2}

呈现html时，foo和bar获得类似于

：someForm:entry:0:foo

，

：someForm:entry:1:foo

，等等的ID。如何通过javascript以编程方式访问这些元素，就像我在JSFIDLE中显示的那样

如果有一条你认为更适合我的路，我绝对愿意尝试

以下是我读过的一些其他问题，但没有得到足够的信息来帮助：

最后一个链接似乎有最好的细节，但它似乎只是不可能做我想做的事情

非常感谢你的帮助，我期待着获得一些新的知识

多谢各位

更新：

我能够想出一个解决方案，并希望与其他人分享，最终在类似的情况下，但首先想补充一些更多的细节

---

现在重读我的问题，我想我遗漏了一些关于如何更新acordionPanel的细节。支持bean维护每个选项卡中出现的内容的状态，当bean更新时，它通过web套接字通知客户机状态已更改。在这个通知中，除了远程命令将更新的内容之外，我还需要在每个选项卡上绘制一些信息。在处理来自websocket的消息时，它将调用上面的远程命令来更新accordionPanel。

正如更新中承诺的那样，这就是我解决问题的方法

我的主要问题是，我需要能够关联传递到web套接字的JSON数据，告诉accordion进行更新。JSON数据包含一个键，但HTML本身没有键。为此，我在div

.layout

中添加了一个

数据键

属性。有了这个属性，我现在能够将每个accordion选项卡与JSON数据关联起来。我还在accordion上定义了widgetVar，以便更好地处理选项卡

#{value.data1}
#{value.data2}

当JSON在脱离web套接字后被处理时，我保存了数据，以便在ajax调用完成后，

processUpdate（）

可以引用它

这使得

processUpdate（）

看起来像这样：

//原始更新消息中的JSON数据
var canvasData=。。。；
函数drawLine（）{
// ...
}
函数processUpdate（）{
var标签=PF（“手风琴”）。面板；
对于（变量i=0；i

---

@Kukeltje-谢谢你帮我解决问题。

我（想我）没有真正理解你的问题。是因为您不知道如何引用

：someForm:someTab:0:elementOfInterest

，其中0在面板中不同？没错，我不确定如何从JavaScript访问这些元素。所以您95%的问题是“噪音”？难怪我花了10分钟才想明白。请改进你的问题。显示代码（以某种格式）的使用位置…我编辑了这个问题，希望它更清楚。在您的代码中没有与“更新”或“渲染”相关的内容，因此您引用的两个链接都是无关的。您的提琴可以包含从真实示例生成的html。那就更清楚了。现在的答案是：

$（'#某种形式\：条目\：0 \：foo'）

。。。