javascript - 选择元素时动态更改p:selectCheckboxMenu的样式

当用户从下拉列表中选择任何值时，我试图更改p：selectCheckboxMenu的样式。例如，更改标签容器的背景颜色（
.ui-selectcheckboxmenu .ui-selectcheckboxmenu-label-container）或边框的颜色。
我的问题是selectCheckboxMenus是在重复组件内部动态生成的。

<h:panelGroup id="multiple" >
      <p:repeat value="#{myBean.keywdLst}" var="kLst" >
          <p:selectCheckboxMenu id="checkmenu" value="#{myBean.selectedKeywords}"
                  label="#{kLst.keywordlistname}" filter="true" filterMatchMode="startsWith"
                  panelStyle="width:250px" valueChangeListener="#{myBean.selectedItemsChanged}" >
                <f:selectItems value="#{kLst.listKeywords}" var="key" itemLabel="#{key.keyword}" itemValue="#{key}" />
          </p:selectCheckboxMenu>
      </p:repeat>
</h:panelGroup>

我不确定解决此问题的正确方法。无论是使用javascript和ajax侦听器，还是使用backing bean，挑战都在于仅获取带有所选项目的selectCheckboxMenus的ID，以及如何将CSS代码推送到那里。
非常感谢您的帮助。谢谢

最佳答案

使用<c:forEach>代替<p:repeat>，以便您可以在循环中获取生成的ID的句柄，然后使用它们。
有关更多详细信息：JSTL in JSF2 Facelets... makes sense?