jsp 页面:
<%@ page language="java" contentType="text/html; charset=gb2312"
pageEncoding="UTF-8"%>
<%@ page import="java.util.Vector,java.util.ListIterator"%>
<%!
Vector vec = new Vector();
%>
<% vec.add("a1");
vec.add("b2");
vec.add("s3");
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Insert title here</title>
</head>
<body>
<script type="text/javascript" src="jstools/_jsDrag/wz_dragdrop.js"></script>
<%
ListIterator iterator = vec.listIterator();
System.out.println("vec.size() is a "+vec.size());
while(iterator.hasNext()){
String id = (String)iterator.next();
System.out.println("vec.id is a "+id);
%>
<div id="<%=id+"tilte" %>" style=" background-color:#0066CC; position:absolute; width:500px; height:25px; left:100px; cursor:move;" align="right">
<input name="tt" type="button" value="test" οnclick="<%=id+"yy" %>();"/><%=id %></div>
<div id="<%=id+"con" %>" style=" background-color:#FFCCFF; position:absolute; width:500px; height:340px; left:750px; cursor:auto">
<iframe src="http://www.sogou.com" width="100%" height="100%"></iframe></div>
<script type="text/javascript">
SET_DHTML("<%=id+"con" %>"+NO_DRAG,"<%=id+"tilte" %>"+CURSOR_MOVE);
function <%=id+"ff()" %>{
dd.elements.<%=id+"con" %>.moveTo(dd.elements.<%=id+"tilte" %>.x, dd.elements.<%=id+"tilte" %>.y+dd.elements.<%=id+"tilte" %>.h);
dd.elements.<%=id+"tilte" %>.addChild("<%=id+"con" %>");
}
function <%=id+"yy()" %>{
if(dd.elements.<%=id+"con" %>.visible){
dd.elements.<%=id+"con" %>.hide();
}else{
dd.elements.<%=id+"con" %>.show();
}
}
<%=id+"ff();" %>
</script>
<%
}
vec.removeAllElements();
//end_while
%>
</body>
</html>
其中脚本语言 wz_dragdrop.js" 的下载地址为:
http://www.walterzorn.com/dragdrop/dragdrop_e.htm
大家可以下载,配置到调试下,仅仅是一个雏形,但是希望对大家有点帮助!
<%@ page language="java" contentType="text/html; charset=gb2312"
pageEncoding="UTF-8"%>
<%@ page import="java.util.Vector,java.util.ListIterator"%>
<%!
Vector vec = new Vector();
%>
<% vec.add("a1");
vec.add("b2");
vec.add("s3");
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Insert title here</title>
</head>
<body>
<script type="text/javascript" src="jstools/_jsDrag/wz_dragdrop.js"></script>
<%
ListIterator iterator = vec.listIterator();
System.out.println("vec.size() is a "+vec.size());
while(iterator.hasNext()){
String id = (String)iterator.next();
System.out.println("vec.id is a "+id);
%>
<div id="<%=id+"tilte" %>" style=" background-color:#0066CC; position:absolute; width:500px; height:25px; left:100px; cursor:move;" align="right">
<input name="tt" type="button" value="test" οnclick="<%=id+"yy" %>();"/><%=id %></div>
<div id="<%=id+"con" %>" style=" background-color:#FFCCFF; position:absolute; width:500px; height:340px; left:750px; cursor:auto">
<iframe src="http://www.sogou.com" width="100%" height="100%"></iframe></div>
<script type="text/javascript">
SET_DHTML("<%=id+"con" %>"+NO_DRAG,"<%=id+"tilte" %>"+CURSOR_MOVE);
function <%=id+"ff()" %>{
dd.elements.<%=id+"con" %>.moveTo(dd.elements.<%=id+"tilte" %>.x, dd.elements.<%=id+"tilte" %>.y+dd.elements.<%=id+"tilte" %>.h);
dd.elements.<%=id+"tilte" %>.addChild("<%=id+"con" %>");
}
function <%=id+"yy()" %>{
if(dd.elements.<%=id+"con" %>.visible){
dd.elements.<%=id+"con" %>.hide();
}else{
dd.elements.<%=id+"con" %>.show();
}
}
<%=id+"ff();" %>
</script>
<%
}
vec.removeAllElements();
//end_while
%>
</body>
</html>
其中脚本语言 wz_dragdrop.js" 的下载地址为:
http://www.walterzorn.com/dragdrop/dragdrop_e.htm
大家可以下载,配置到调试下,仅仅是一个雏形,但是希望对大家有点帮助!