javascript - 动态更改 p :selectCheckboxMenu when items are selected 的样式

Question

当用户从下拉列表中选择任何值时，我试图更改 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 监听器还是在支持 bean 中，挑战都是仅获取带有所选元素的 selectCheckboxMenus 的 ID，以及如何将 css 代码推送到那里。

非常感谢任何帮助。
谢谢

Answer 1

使用 <c:forEach>而不是 <p:repeat>这样您就可以在循环中获取生成的 ID 的句柄，然后使用它们。 更多详情:JSTL in JSF2 Facelets... makes sense?