用javascript脚本--动态指定img对象的src路径---jsp-javascript-j2ee--hibernate--struts-2.0

javascript,img,src,jsp,j2ee,hibernate,struts-2.0

环境: eclipse, struts2,hibernate3.0

jsp,j2ee,javascript   [撰写: drs163@163.com   www.newsoftstudio.com ]

后台服务端struts2的action已经能将一个列表集合返回到jsp页面. 其中有一个项目是 文件路径的字符串. 我们需要在实际jsp页面显示出来的时候,每行记录前带一个 根据文件类型后缀判断得出的小图标.

假设现在已经将 类似 gif.gif ,rar.gif,doc.gif的类型图标保存到了 images/myfiletype目录.

jsp页面是 Mylist.jsp,那么我们写 两个脚本函数 和一段脚本代码即可实现这个功能(当然,通过服务器段判断处理也能达到)

第一个脚本函数: 返回指定url的关于类型的部分字符串

function ShowFileTypeImg(strUrl)
{

  // by drs -2007-6-2 根据指定 url 获得其后缀 类型
  var pos = strUrl.lastIndexOf(".");
  if (pos<=0)
   {
    return "unknow.gif";
   }
   var lastname = strUrl.substring(pos+1,strUrl.length);  //文件后缀名
   return lastname+".gif";
 
}

第二个脚本函数:

          // 指定 动态img对象的 src
          // img 的 id名称 根据 当前列表的资源id保证其唯一和不同
          // 在页面中的img对象后面立即撰写 <script>getimg(img对象id,url)</>可以完成此功能
          // 从而可以动态指定其 src路径
          // 调用 ShowFileTypeImg(urlfilename) 函数
          function getimg(imgid,urlfilename){
            var   oImg   =   document.getElementById(imgid); //根据id获得 img对象
          var   appPath ;
          appPath ="<%=PageContent.getAppPath()%>" ;
                                  
          var mysrc ;
          mysrc =appPath + "/images/myfiletype/"+ ShowFileTypeImg(urlfilename); 

          oImg.src    = mysrc; //设定其src
                                  
          }  

 

一段javascript代码放到img对象的后头(紧跟其后,可以不用其 onload事件)

说明: onerror事件指定了当有未知的类型,也就是filetype目录中没有该类型对应图标时,一律显示为指定的图标. 

====id="myfileimg<s:property value="FId"/> ==表示动态生成的img 对象id  <s:..>是struts2.0的属性标签,这里它属于iterator,并返回id值,从而达到img 的id是唯一的

然后将这个img的id名称以字符串形式传递给getimg ,将文件路径传递也传递给getimg()

==========DAIMA ========================

......

...<s:iterator value="MyListitems" status="curRecord">

...

<img  οnerrοr="this.src='<%=PageContent.getAppPath()%>/images/myfiletype/unknow.gif';" border="0" src="a" id="myfileimg<s:property value="RId"/>"  >
        <script type="text/javascript">
          getimg("myfileimg<s:property value="FId"/>","<s:property value="FFileNameUrl"/>")
        </script>

......

...... </s:iterator>

......