我想设置PrimeFaces组件<p:fileUpload value="#{dms.fileToUpload}" mode="simple" skinSimple="true" styleClass="chooseFile"/>
的输入按钮type =“ file”的样式。
如您所见,`的整个背景都在变化,而不是输入按钮本身。可以更改按钮的样式吗?
我正在使用PrimeFaces 5.1
最佳答案
在较旧的PrimeFaces版本中,简单上传使用cannot be styled的纯HTML上传。 PrimeFaces 5.1是无法直接设置简单上传样式的版本之一。
如果您在for属性中使用了正确的值(我在展示柜中尝试过),那么摆弄方法就可以解决。
但是,较新的版本使用“包装变通方法”,您似乎认为在skinSimple="true"
attribute中启用了“包装变通方法”,但实际上并没有。 PrimeFaces生成以下html,然后将其作为上载小部件的一部分:
<span class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-left">
<span class="ui-button-icon-left ui-icon ui-c ui-icon-plusthick"/>
<span id="j_idt88:j_idt89_label" class="ui-button-text ui-c">Choose</span>
<input id="j_idt88:j_idt89_input" name="j_idt88:j_idt89_input" aria-labelledby="j_idt88:j_idt89_label" type="file" />
</span>
该
ui-button
可以随意设置样式,因为它“包裹”了实际上不可见的真实文件输入。您可以在PrimeFaces showcase中玩这个游戏