xml数据岛绑定时的超链接处理

csstome · 发表于 2013-2-7 20:02:10

在写地图空间搜索的时候，用ajax返回的数据结果，除了要在地图上标点之外还需要用传统的表格方式罗列，并且可以点击察看信息，因为需要对返回结果的处理足够灵活，所以不能在js当中写死格式。这里用了xml数据岛的方式（系统是只需要考虑IE）只把要用到xml数据信息返回，具体怎么在html页面上布局可以由其它开发人员自己订制。
下面代码去掉了ajax的部分，只简单的演示如何生成一个xml数据岛，以及如何和html表格绑定，并显示出相关的链接信息。其中链接的href内容可以保存在xml数据中，用datafld属性来处理。
<div style="padding-right: 5.4pt; padding-left: 5.4pt; background: #e6e6e6; padding-bottom: 4px; width: 95%; padding-top: 4px;">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<head>

<title>XML数据岛</title>

</head>

<scripttype="text/jscript">...

//获取xml，实际应用中大多是ajax异步获取的

functiongetData()

...{

varxmlData="<xmlID=\"xmlData\"><root>";

for(vari=0;i<5;i++)

...{

try

...{

varid="Name"+i;

varType="Type"+i;

xmlData+="<METADATA><Name>"+id+"</Name><Type>"+Type+"</Type><Href>javascript:alert('"+id+"')</Href></METADATA>";

pointIndex++;

}

catch(e)

...{

}

xmlData+="</root></xml>";

document.all.xmlDataPanel.innerHTML=xmlData;

}

//简单的添加xml信息

functionaddData()

...{

varxmlData=document.all.xmlDataPanel.innerHTML;

xmlData=xmlData.replace("</root></xml>","");

xmlData+="<METADATA><Name>newName</Name><Type>newType</Type><Href>javascript:alert('newName')</Href></METADATA>";

xmlData+="</root></xml>";

document.all.xmlDataPanel.innerHTML=xmlData;

}

</script>

<body>

<buttononclick="javascript:getData();">获取数据</button>

<buttononclick="javascript:addData();">添加数据</button>

<divid="xmlDataPanel">

</div>

<divstyle="overflow:scroll;height:180;width:180"align="center">

<divalign="left">

<tabledatasrc="#xmlData"border="1">

<tr>

<td>

<adatafld="Href"><spandatafld="Name"></span></a>

</td>

<td>

<spandatafld="Type"></span>

</td>

</tr>

</table>

</div>

</body>

</html>

		自动登录	找回密码
密码			立即注册

xml数据岛绑定时的超链接处理

浏览过的版块