Question

无法为图片动态分配id值...我引用此图片javascript来相应地显示向上/向下箭头...这里是代码片段...

<apex:variable var="count" value="{!1}"/>
<apex:image id="msn{!count}" url="{!URLFOR($Resource.style_resources, 'images/up-arrow.gif')}" alt="Open-close" />

但是我得到了编译错误，因为“期望文字值为id”......

我们不能动态分配id属性的值吗？

Answer 1

来自Apex image，

<apex:image id="theImage" value="/img/myimage.gif" width="220" height="55"/>

上面的示例呈现以下HTML：

<img id="theImage" src="/img/myimage.gif" width="220" height="55"/>

所以改变

<apex:image id="msn{!count}" url="{!URLFOR($Resource.style_resources, 'images/up-arrow.gif')}" alt="Open-close" />

到

<img id="msn{!count}" src="{!URLFOR($Resource.style_resources, 'images/up-arrow.gif')}" alt="Open-close" />

Answer 2

你是对的，不能动态分配元素id。它必须是一个字符串文字。但是，我使用了class属性来创建以后可以在javascript中使用的自定义ID。我用jQuery做这个，它是强大的选择器，可以根据标签类型和类选择元素。

以下示例只是一个示例，但使用jQuery，您可以获得非常有创意。

<apex:variable var="count" value="{!1}"/>
<apex:image id="msn" 
    url="{!URLFOR($Resource.style_resources, 'images/up-arrow.gif')}" 
    alt="Open-close"
    styleClass="msn{!count}" />

    <apex:includeScript value="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"/>

    <script>
        jQuery.noConflict();

        function doSomethingWithImg() {
            try {
                var imgElement = jQuery('.msn1');

                /*Do what you need to do with the element*/
            } catch (e) { /*Ignore Error*/ }
        }
     </script>

以下是jQuery选择器的链接：jQuery Selector Documentation

如何在visualforce页面中为image标签的id属性赋值？

2 个答案: