换静态图片---轻开电子商务系统(企业入门级B2C网站)

一共3个文件:

  1. 显示及上传文件:site/links/img_one.html
  2. 保存图片文件:site/links/img_one_up1.chtml
  3. 导航菜单文件:site/links/menu.html

轻开电子商务系统(企业入门级B2C网站)的site/links/目录下

显示图片信息且上传表单:site/links/img_one.html

显示标题(从menu.html文件传过来的标题

<tr><th colspan=2>.<font class=listTitle>@{pPage:title}</font>.</th></tr>
显示图片(从menu.html文件传过来的图片名
<tr><td colspan=2 align=center><img src="@{sys:path}@{pPage:src}" border=1 id=_img /></td></tr>
选择图片的input
<tr><td><font class=actTitle>新  图  片</font></td><td><INPUT name=IMAGE size=32 type=file><a id=_iwh>(283px × 51px)</a></td></tr>
计算图片宽高的js函数
imgWidthHeight = function ()
{
	var _img = document.getElementById("_img");
	var _iwh = document.getElementById("_iwh");
	_iwh.innerHTML = "("+_img.offsetWidth+"px × "+_img.offsetHeight+"px)";
}
提交新图片的表单(提交到site/links/img_one_up1.chtml)
<form id=save action="@{sys:face}site/links/img_one_up1.chtml" onsubmit="return false;" target=_self method=post enctype="multipart/form-data">
	... ...
</form>
需要提交到保存页面的其他字段
	<input type=hidden name=reUrl value="site/links/img_one.html">
	<input type=hidden name=src value="@{pPage:src}">
	<input type=hidden name=title value="@{pPage:title}">
保存操作
	<chtml>
	<if x="@{sys:canDo}">
		<div align=right x=true><a href="javascript:doSubmit()" title="保存新图片!">[保存]</a>  </div>
	</if>
	</chtml>
校验提交的js函数
var save = document.forms['save'];
doSubmit = function ()
{
	var str = save['IMAGE'].value.toLowerCase();
	if(str!="")
	{
		var pos = str.lastIndexOf(".");
		if(pos==-1){alert("请选择正确的图片文件");return;}
		str = str.substring(pos);
		var ImgSrc = "@{pPage:src}".toLowerCase();
		pos = ImgSrc.lastIndexOf(".");
		if(pos==-1){alert("无法替换错误的图片文件");return;}
		var ImgExt = ImgSrc.substring(pos);
		if(str!=ImgExt)
		{alert("只能用 "+ImgExt+" 图片");return;}
	}
	else{
		alert("必需上传图片!");
		return;
	}
	save.submit();
}
效果

全部代码

<html>
<title>换静态图片</title>
<link href="@{sys:path}base/css/system.css" rel="stylesheet" type="text/css">
<BODY leftMargin="0" topMargin="0" scroll="no" MARGINWIDTH="0" MARGINHEIGHT="0" onload="imgWidthHeight()">
<LINK href="@{sys:path}base/css/main.css" type="TEXT/CSS" rel="STYLESHEET">
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
	<TR vAlign=top>
	<TD style="BACKGROUND-REPEAT: repeat-x" background="@{sys:path}images/Title2.gif">
		<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
			<TR vAlign=top>
			<TD height=32 style="BACKGROUND-REPEAT: no-repeat" noWrap width="100%" class="GAP1">
			<P style="MARGIN-LEFT: 2px; MARGIN-RIGHT: 3px"><IMG height=9 src="@{sys:path}images/k7.gif" width=9 align=absMiddle> 换静态图片</P></TD></TR></TABLE>
	</TD>
	<TD width=10 class="GAP1"><IMG height=21 src="@{sys:path}images/Title3.gif" width=16></TD>
<chtml><Bag id=sys><we name=NodeID>a0</we></Bag><!-- 栏目节点 --></chtml>
<chtml file="base/ac/checkAcl.htm"/><!-- 引入权限检查文件 -->
	<TD style="BACKGROUND-REPEAT: repeat-x" vAlign=bottom width="100%" background="@{sys:path}images/Title4.gif">
	<chtml>
	<if x="@{sys:canDo}">
		<div align=right x=true><a href="javascript:doSubmit()" title="保存新图片!">[保存]</a>  </div>
	</if>
	</chtml>
	</TD>
	</TR>
</TABLE>
<table width=99% align=center border=1 cellpadding="3" cellspacing="0" style="border-collapse:collapse;font-size:12px">
<tr><th colspan=2>.<font class=listTitle>@{pPage:title}</font>.</th></tr>
<form id=save action="@{sys:face}site/links/img_one_up1.chtml" onsubmit="return false;" target=_self method=post enctype="multipart/form-data">
	<input type=hidden name=reUrl value="site/links/img_one.html">
	<input type=hidden name=src value="@{pPage:src}">
	<input type=hidden name=title value="@{pPage:title}">
	<tr><td colspan=2 align=center><img src="@{sys:path}@{pPage:src}" border=1 id=_img /></td></tr>
	<tr><td><font class=actTitle>新  图  片</font></td><td><INPUT name=IMAGE size=32 type=file><a id=_iwh>(283px × 51px)</a></td></tr>
</form>
</table>
</BODY>
</html>
<script>
var save = document.forms['save'];
doSubmit = function ()
{
	var str = save['IMAGE'].value.toLowerCase();
	if(str!="")
	{
		var pos = str.lastIndexOf(".");
		if(pos==-1){alert("请选择正确的图片文件");return;}
		str = str.substring(pos);
		var ImgSrc = "@{pPage:src}".toLowerCase();
		pos = ImgSrc.lastIndexOf(".");
		if(pos==-1){alert("无法替换错误的图片文件");return;}
		var ImgExt = ImgSrc.substring(pos);
		if(str!=ImgExt)
		{alert("只能用 "+ImgExt+" 图片");return;}
	}
	else{
		alert("必需上传图片!");
		return;
	}
	save.submit();
}
imgWidthHeight = function ()
{
	var _img = document.getElementById("_img");
	var _iwh = document.getElementById("_iwh");
	_iwh.innerHTML = "("+_img.offsetWidth+"px × "+_img.offsetHeight+"px)";
}
</script>

保存图片的文件(site/links/img_one_up1.chtml)

保存新上传的图片(一行代码搞掂)

<file value="@{pPage:IMAGE}" islast>@{pPage:src}</file>
全部代码
<html>
<!-- 栏目节点 -->
<chtml><Bag id=sys><we name=NodeID>a0.0</we></Bag></chtml>
<chtml file="base/ac/checkAcl.htm"/><!-- 引入权限检查文件 -->
<chtml>
<if x="@{sys:canDo}" else=1>
	<we x=true>
		<file value="@{pPage:IMAGE}" islast>@{pPage:src}</file>
		<script>
alert("修改成功!");location.href='@{sys:face}@{pPage:reUrl}?src=@{pPage:src}&title='+encodeURIComponent("@{pPage:title}");
		</script>
	</we>
	<script>
alert("您没有权限!");
location.href='@{sys:face}@{pPage:reUrl}?src=@{pPage:src}&title='+encodeURIComponent("@{pPage:title}");
	</script>
</if>
</chtml>
</html>
导航菜单文件(site/links/menu.html)
导航项目的js数组

var urls = new Array();
urls[0] = new Array();
...
urls[1] = new Array();
urls[1][0]="img_logo.html";
urls[1][1]="img_one.html?src=images/tmp/KEteltu1.jpg&title="+encodeURIComponent("400电话图");
urls[1][2]="img_one.html?src=images/menu/hot.jpg&title="+encodeURIComponent("热卖推荐");
urls[1][3]="img_one.html?src=images/menu/yushiyongpin.jpg&title="+encodeURIComponent("主页第2张导航小图");
urls[1][4]="img_one.html?src=images/menu/chuangpin.jpg&title="+encodeURIComponent("主页第3张导航小图");
urls[1][5]="img_one.html?src=images/menu/chuangpintaozhuang.jpg&title="+encodeURIComponent("主页第4张导航小图");
urls[1][6]="img_one.html?src=images/menu/ertongfang.jpg&title="+encodeURIComponent("主页第5张导航小图");
urls[1][7]="img_one.html?src=images/menu/beixin.jpg&title="+encodeURIComponent("主页第6张导航小图");
urls[1][8]="img_one.html?src=images/menu/zhenxin.jpg&title="+encodeURIComponent("主页第7张导航小图");
urls[1][9]="img_one.html?src=images/foot.jpg&title="+encodeURIComponent("页脚导航图");
显示菜单
  <TR vAlign="top">
    <TD>
      <TABLE cellSpacing="0" cellPadding="0" width="90%" align="center" border="0" id="sub1" style="display:none">
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,0)"><NOBR>Logo</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,1)"><NOBR>400电话图</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,2)"><NOBR>热卖推荐</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,3)"><NOBR>主页第2张导航小图</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,4)"><NOBR>主页第3张导航小图</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,5)"><NOBR>主页第4张导航小图</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,6)"><NOBR>主页第5张导航小图</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,7)"><NOBR>主页第6张导航小图</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,8)"><NOBR>主页第7张导航小图</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,9)"><NOBR>页脚导航图</NOBR></A></TD>
		</TR>
	  </TABLE>
	</TD>
  </TR>
效果

全部代码(含前边介绍的换其他图片的导航)

<html>
<head>
<script>
var urls = new Array();
urls[0] = new Array();
urls[0][0]="img0.html";
urls[0][1]="img1.html";
urls[0][2]="img2.html";
urls[0][3]="img3.html";
urls[0][4]="img4.html";
urls[0][5]="img5.html";
urls[0][6]="img6.html";
urls[0][7]="img7.html";
urls[0][8]="img8.html";
urls[0][9]="img9.html";
urls[0][10]="img10.html";
urls[1] = new Array();
urls[1][0]="img_logo.html";
urls[1][1]="img_one.html?src=images/tmp/KEteltu1.jpg&title="+encodeURIComponent("400电话图");
urls[1][2]="img_one.html?src=images/menu/hot.jpg&title="+encodeURIComponent("热卖推荐");
urls[1][3]="img_one.html?src=images/menu/yushiyongpin.jpg&title="+encodeURIComponent("主页第2张导航小图");
urls[1][4]="img_one.html?src=images/menu/chuangpin.jpg&title="+encodeURIComponent("主页第3张导航小图");
urls[1][5]="img_one.html?src=images/menu/chuangpintaozhuang.jpg&title="+encodeURIComponent("主页第4张导航小图");
urls[1][6]="img_one.html?src=images/menu/ertongfang.jpg&title="+encodeURIComponent("主页第5张导航小图");
urls[1][7]="img_one.html?src=images/menu/beixin.jpg&title="+encodeURIComponent("主页第6张导航小图");
urls[1][8]="img_one.html?src=images/menu/zhenxin.jpg&title="+encodeURIComponent("主页第7张导航小图");
urls[1][9]="img_one.html?src=images/foot.jpg&title="+encodeURIComponent("页脚导航图");
</script>
<TITLE>网页图片管理</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<LINK href="@{sys:path}base/css/main.css" type="TEXT/CSS" rel="STYLESHEET">
</head>
<BODY bottomMargin="2" leftMargin="4" topMargin="4" scroll="no" rightMargin="4" bgcolor="#70ADDE" onload="showSub(0)">
<TABLE class="ViewListLocal" cellSpacing="0" cellPadding="0" width="100%" border="0">
  <TR>
    <TD background="@{sys:path}images/menu_bg.gif" valign="middle" width="100%" height="21" align="center">
	  <TABLE width="96%"><TR align="center"><TD onmouseup="this.className='TopLink_over'" onmousedown="this.className='TopLink_down'" onmouseover="this.className='TopLink_over'" style="CURSOR: pointer" onmouseout="this.className=''" onclick="showSub(0)"><NOBR>换动态图片</NOBR></TD></TR></TABLE>	
	</TD>
  </TR>
  <TR vAlign="top">
    <TD>
      <TABLE cellSpacing="0" cellPadding="0" width="90%" align="center" border="0" id="sub0" style="display:none">
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(0,0)"><NOBR>主题图片管理</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20" style="display:none">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(0,1)"><NOBR>滚动图片管理</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(0,2)"><NOBR>今日特价</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(0,3)"><NOBR>主页第1张大横广告</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(0,4)"><NOBR>主页第2张大横广告</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20" style="display:none">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(0,5)"><NOBR>女装</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20" style="display:none">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(0,6)"><NOBR>男装</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(0,7)"><NOBR>特价广告</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20" style="display:none">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(0,8)"><NOBR>实体店主题图片</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20" style="display:none">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(0,9)"><NOBR>实体店销量排行</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20" style="display:none">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(0,10)"><NOBR>店员风采</NOBR></A></TD>
		</TR>
	  </TABLE>
	</TD>
  </TR>
  <TR>
    <TD background="@{sys:path}images/menu_bg.gif" valign="middle" width="100%" height="21" align="center">
	  <TABLE width="96%"><TR align="center"><TD onmouseup="this.className='TopLink_over'" onmousedown="this.className='TopLink_down'" onmouseover="this.className='TopLink_over'" style="CURSOR: pointer" onmouseout="this.className=''" onclick="showSub(1)"><NOBR>换图片(1张)</NOBR></TD></TR></TABLE>	
	</TD>
  </TR>
  <TR vAlign="top">
    <TD>
      <TABLE cellSpacing="0" cellPadding="0" width="90%" align="center" border="0" id="sub1" style="display:none">
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,0)"><NOBR>Logo</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,1)"><NOBR>400电话图</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,2)"><NOBR>热卖推荐</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,3)"><NOBR>主页第2张导航小图</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,4)"><NOBR>主页第3张导航小图</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,5)"><NOBR>主页第4张导航小图</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,6)"><NOBR>主页第5张导航小图</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,7)"><NOBR>主页第6张导航小图</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,8)"><NOBR>主页第7张导航小图</NOBR></A></TD>
		</TR>
        <TR vAlign="middle" height="20">
          <TD width="9%"><IMG src="@{sys:path}images/k7.gif"></TD>
          <TD width="91%"> <A href="javascript:void(0)" onClick="openUrl(1,9)"><NOBR>页脚导航图</NOBR></A></TD>
		</TR>
	  </TABLE>
	</TD>
  </TR>
</TABLE>
</BODY>
<script>
var old = -1;
showSub = function (i)
{
	try{
		var aObj;
		if(old!=-1)
		{
			aObj = document.getElementById("sub"+old);
			aObj.style.display = "none";
		}
		if(old!=i)
		{
			aObj = document.getElementById("sub"+i);
			aObj.style.display = "block";
			old = i;
			openUrl(i,0);
		}
		else old = -1;
	}catch(err){}
}
openUrl = function (i,j)
{
	var url = urls[i][j];
	try{
		if(url!="")
		{
			top.data.location = url;
		}
	}catch(err){}
}
</script>
</html>

三个文件都在轻开电子商务系统(企业入门级B2C网站)的site/links/目录下大笑

轻松互联网开发平台(Easy Do IT)资源下载

开发实例:企业入门级B2C电子商务网站(含轻开源码),免费下载:http://download.csdn.net/detail/tx18/8818883

轻开平台(技术QQ群:460801944)会不定期升级为大家提供更多强大而Easy的功能,请留意下载最新的版本

本文可自由传播

阅读更多
版权声明:本文为博主原创文章,博主允许自由转载。 https://blog.csdn.net/tx18/article/details/46703705
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

不良信息举报

换静态图片---轻开电子商务系统(企业入门级B2C网站)

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭