Question

我已经编写了一个JSP登录页面，我在其中获取了USER名称，并根据用户名称从images文件夹中显示用户的图片，为此，我根据用户名更改了图像的名称，所以每当用户根据用户名输入用户名时，它就会获得userpic。下面是我获取用户名并尝试将其应用于图像源的代码。

<SCRIPT>
var request_custom;  
    function userId()  
        {  
           var userId = (document.getElementById("<%=userFieldName%>").value);
    alert("SamDONE"+userId);
        }      
</SCRIPT>



<div style="background: **url(images/<%=userFieldName%>.jpg)**;width:200px; height:180px; font-size:40 ";>

请告诉我如何传递变量以获取图像。

Answer 1

如果您希望模型中的数据在javascript中可用，则需要将其存储在呈现页面上的某个位置。

您可以使用JSP编写JavaScript，将模型分配给JavaScript变量。

<script>
    var userId =<c:out value="${userFieldName}"/>
</script>

另一种解决方案可以使用一个隐藏输入，然后从javascript中读取隐藏的输入值

<input type="hidden" id="hiddenUserName" value='${userFieldName}'/>

<script>
    var userId = document.getElementById("hiddenUserName");
</script>

然后，您可以从javascript

设置元素的样式

<div id="imgDiv"></div>

<script>
    var elem = document.getElementById("imgDiv");
    elem.style.background = 'url(images/' + userId + '.png)'; //assuming image is a .png file
    elem.style.width='200px';
    elem.style.height='180px';
    elem.style.fontSize = "40px";
</script>

如何在HTML JSP页面中的Image源中传递变量

1 个答案: