- 论坛徽章:
- 0
|
看了 乔楚 很多的回帖跟作品,不由地也被他带动学习javascript的兴趣
看了 乔楚" 图像浏览画册" 自己也想将 XMLHttpRequest结合进去 小弟献丑将代码贴上
望各位高手多多指点, 里面参考了乔楚作品的很多代码
共三个文件
第一个 file1 保存为XNConn.js
在这里 就不在贴了 http://bbs.chinaunix.net/viewthread.php?tid=670239&extra=page%3D1
第二个 file2 保持为 dir.php
- <?php
- /*
- File name : dir.php + test.html +XNConn.js
- Description : 图像浏览画册
- Requirement : HTML+JavaScript+XMLHttpRequest
- Copyright(C), ydlhero, 2005/12/19, All Rights Reserved.
- Author:ydlhero (ydlhero@hotmail.com)
- */
- //支持的图形ext
- $imgArr[]="gif";
- $imgArr[]="jpg";
- $imgArr[]="JPG";
- $getDir=".".$_POST["dir"];
- $getDir=str_replace(".//","./",$getDir);
- $getDir=str_replace("//","/",$getDir);
- $getDir=str_replace("\\","/",$getDir);
- $fileDir=getcwd();
- if ($handle = opendir($getDir)) {
- $img="";
- $dir="";
- while (false !== ($file = readdir($handle))) {
- if(is_dir($getDir.$file)){
- if($file!='.' && $file!='..')
- $dir.=$file."/";
- }else{
- $extarr=explode('.',$file);
- $n=count($extarr)-1;
- if(in_array($extarr[$n],$imgArr)){
- $img.=$file."/";
- }
- }
- }
- chdir($getDir);
- $nowdir=str_replace($fileDir,'',getcwd());
- chdir("./../");
- $ParentDir=str_replace($fileDir,'',getcwd());
- $ParentDir=str_replace("\\","/",$ParentDir);
- $nowdir=str_replace("\\","/",$nowdir);
- $ParentDir=$ParentDir."/";
- if($ParentDir=='/')$ParentDir='//';//现在所在的父目录
- $nowdir=$nowdir."/";//现在所在目录
- closedir($handle);
- echo $dir.",".$img.','.$nowdir.','.$ParentDir; //返回 目录文件 次目录的图形文件 现在所在目 父目录
- }
- ?>
第三个 file3 保存为test.html
- <html>
- <body>
- <script type="text/javascript" src="XNConn.js"></script>
- <script language='javascript'>
- /*
- File name : dir.php + test.html +XNConn.js
- Description : 图像浏览画册
- Requirement : HTML+JavaScript+XMLHttpRequest
- Copyright(C), ydlhero, 2005/12/19, All Rights Reserved.
- Author:ydlhero (ydlhero@hotmail.com)
- */
- /********Opent news windows**************/
-
- var serverGet;//get info form server
- var dirGet;//get dir from server /Array
- var imgGet;//get img from server /Array
- var myConn = new XHConn();//xmlHTTP
- // var imgUrl="http://localhost/tiaos/js/"; //server的路径
- var imgUrl="http://210.34.160.160/cwd/"; //server的路径
- var ImgBaseHref=imgUrl;
- var trNum=3;//一页多少行
- var tdNum=4;//一行多少张图
- var totalNum;
- var pageNum;
- var nowDir;//现在访问的地址
- var i;
- function OpenWindow(TheUrl, WinName, WinOpt, objid)//打开新窗口
- {
- var imgId=document.getElementById('img'+objid);
- if (imgId.name=="")
- {
- alert("请稍后，"+imgId.alt+"正在下载......");
- }
- if (imgId.name=="")
- {
- return false;
- }
- winName = "objopenwin";
- imgheight = 400;
- imgwidth =imgheight * imgId.width/imgId.height;
- WinOpt = "width=" + (imgwidth) + ",height=" + (imgheight) + ",outerHeight=0,outerWidth=0,location=no,menubar=no,resizable=no,status=no,screenX="+(window.screen.width-10)+",screenY="+(window.screen.height-10)+",scrollbars=no,titlebar=no,toolbar=no,z-look=yes,alwaysRaised=yes,dependent=yes";
- objopenwin=window.open("about:blank",winName,WinOpt);
- // objopenwin.document.title.title="4";
- //alert( objopenwin.document.title.title);
- objopenwin.document.write("<HTML>");
- objopenwin.document.write("<TITLE>" + imgId.name + "</TITLE>");
- objopenwin.document.write("<BODY leftmargin='0' topmargin='0'>");
- objopenwin.document.write("<IMG SRC='"+TheUrl+"' border='0' vwidth='"+imgwidth+"' vheight='"+imgheight+"'>");
- objopenwin.document.write("</BODY>");
- objopenwin.document.write("</HTML>");
- objopenwin.document.close();
- itWidth = objopenwin.document.images[0].width;
- itHeight = objopenwin.document.images[0].height;
- if (0 && itHeight > imgheight)
- {
- objopenwin.document.images[0].width = imgwidth;
- objopenwin.document.images[0].height = imgheight;
- objopenwin.resizeTo(imgwidth + 10, imgheight + 55);
- }else{
- objopenwin.resizeTo(itWidth + 10, itHeight + 55);
- }
- objopenwin.document.oncontextmenu = noevent;
- objopenwin.document.onmousedown = noevent;
- objopenwin.focus();
- }
- document.oncontextmenu = noevent;
- document.onmousedown = noevent;
- function noevent()
- {
- return true;
- }
- /***********creat Table**************/
- var tbl,tb2, tbody, tr, td, text, i, max,j;
- function creatTable(page){
- var nums,imgName,tem;
- tem="";
- tem+="总共"+pageNum+"页 ";
- tbl = document.getElementById("td1");
- if(page>0){
- tbl.removeChild(tbody);//删除 tbody
- }else {
- page++;
- }
- tbl.width = "750";
- for(i=1;i<=pageNum;i++){
- tem= tem+"[<a href='#' onclick='creatTable("+i+")'>"+i+"</a>]" ;
- }
- var divId= document.getElementById("outDiv");
- divId.innerHTML=tem;
- tbody = document.createElement("TBODY");
- tbl.insertBefore(tbody, null);
- for (i=0; i< trNum; i++) {
- tr = document.createElement("TR");
- for(j=0;j<tdNum;j++){
- td = document.createElement("TD");
- td.align="center";
- td.height="180";
- if((i*trNum+j+(page-1)*trNum*tdNum)<totalNum){
- nums=(i*trNum+j+(page-1)*trNum*tdNum);
- imgName=imgGet[nums];
- td.innerHTML="<a href='#' onClick=\"javascript:OpenWindow('"+ImgBaseHref+imgName+"','','',"+nums+") ;return false;\" ><img border='1' src='"+ImgBaseHref+imgName+"' alt='["+imgName+"]' NAME='["+imgName+"]' border='0' id='img"+nums+"' width='150' height='120'></a>";
- }
- tr.insertBefore(td, null);
- }
- tbody.insertBefore(tr, null);
- }
- }
- /******creat dir***"*******/
- function getInfo(dir){
- if (!myConn) {alert("XMLHTTP not available. Try a newer/better browser.");}
- var fnWhenDone = function (oXML) {
- serverGet=oXML.responseText;
- var dirInfo="";
- var serArr=serverGet.split(',');
- imgGet=serArr[1].split('/');
- dirGet=serArr[0].split('/');
- for(i=0;i< (dirGet.length-1);i++){
- dirInfo+=" [<a href='#' onClick=\"getInfo('"+dir+dirGet[i]+"/')\">"+dirGet[i]+"</a>] ";
- }
- if(dirInfo=="")dirInfo="无";
- dirInfo=" 子目录:"+dirInfo;
- totalNum=imgGet.length-1;
- pageNum=Math.round(totalNum / (trNum * tdNum)+0.4);
- if(dir=='/'){//第一次进入的时候
- dirInfo="当前目录:[//]"+dirInfo;
- ImgBaseHref = imgUrl+dir.replace(/\/\//gi,"/");
- creatTable(0);
- }else{
- //alert(dir);
- ImgBaseHref = imgUrl+dir.replace(/\/\//gi,"/");
- // alert(ImgBaseHref);
- if(dir=='//'){
- dirInfo="当前目录:[//]"+dirInfo;
- }else{
- if(serArr[2]!=''){
- dirInfo="当前目录:["+serArr[2]+"]"+dirInfo;
- }else {
- dirInfo="当前目录:[//]"+dirInfo;
- }
- if(serArr[3]=='')serArr[3]='//';
- dirInfo="上级目录:[<a href='#' onClick=\"getInfo('"+serArr[3]+"')\">"+serArr[3]+"</a>] "+dirInfo;
- }
- creatTable(1);
- }
- var pageDiv=document.getElementById("pageDiv");
- pageDiv.innerHTML=dirInfo;
- }
- // dir=dir.replace(/\/\//gi,"/");
- myConn.connect("dir.php", "POST", "dir="+dir, fnWhenDone);
- }
- </script>
- <body valign="center" onLoad="getInfo('/')">
- <div id="pageDiv" align="center"></div>
- <table width="750" border=0 align="center" id="pTable" name="pTable">
- <tr id="pTr" name="pTr">
- <td >
- <table id="td1"></table>
- </td>
- </td>
- </tr>
- </table>
- <div id="outDiv" align="center"></div>
- </body>
- </html>
[ 本帖最后由 ydlhero 于 2005-12-20 00:05 编辑 ] |
|
免费注册
发表于 2005-12-20 00:02
发表于 2005-12-20 17:07
