从javascript访问JSF资源 [英] Access JSF resource from javascript

问题描述

我想从JavaScript函数(如WebPages/resources/img下)访问JSF资源:

I want to access a JSF resources ( under WebPages/resources/img) from a javascript function like:

function hideSpinner() {
    arguments[i].poster = './img/sppiner.png';
}

我已经尝试过arguments[i].poster = "${resource['img/sppiner.png']}";和arguments[i].poster = '${resource[\'img/sppiner.png\']}';，但是它不起作用.

I have tried arguments[i].poster = "${resource['img/sppiner.png']}"; and arguments[i].poster = '${resource[\'img/sppiner.png\']}'; but it doesnt work..

我该怎么办?

推荐答案

仅在Facelets(XHTML)文件和通过<h:outputStylesheet>加载的CSS文件中评估EL表达式.不会在通过<h:outputScript>加载的JS文件中对它们进行评估.

EL expressions are only evaluated in Facelets (XHTML) files and in CSS files loaded via <h:outputStylesheet>. They are not evaluated in JS files loaded via <h:outputScript>.

您基本上需要渲染一个内联脚本，该脚本设置一个(全局)JavaScript变量，JS文件应依次引用该变量.

You basically need to render an inline script which sets a (global) JavaScript variable which the JS file should in turn refer to.

<h:outputScript>var spinnerImage = "${resource['img/sppiner.png']}";</h:outputScript>
<h:outputScript name="js/some.js" />

arguments[i].poster = spinnerImage;

但是，更干净的方法是将图像设置为与特定CSS样式类关联的CSS背景图像，然后让JavaScript在所需元素上设置该样式类.如前所述，您可以在通过<h:outputStylesheet>加载的CSS文件中使用EL表达式.另请参阅如何将JSF图像资源引用为CSS背景图像网址.

Much cleaner, however, is to set the image as a CSS background image associated with a specific CSS style class and then just let JavaScript set that style class on the desired element. As said, you can use EL expressions in CSS files loaded via <h:outputStylesheet>. See also a.o. How to reference JSF image resource as CSS background image url.

这篇关于从javascript访问JSF资源的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！