横向重复区域显示二法

 更新时间:2016年11月25日 16:32  点击:2267

方法一. 注重这里有一个预先定义的图片记录集rsmpic 要横向重复的就是图片,请根据你的情况改为你的记录集名称.整洁地将横向重复内容放在一个表格内


<table width="100" border="0" align="center" cellpadding="5" cellspacing="5">

<?php $startrw = '0';// 开始定义横向重复内容 这里设定为 3 行 3 列
$endrw = $HLooper1__index;
$numberColumns = '3';
$numrows = '3';
while(($numrows <> 0) AND (!$rsmpic->EOF))
{
$startrw = $endrw 1;
$endrw = $endrw $numberColumns;?>

<tr>
<?php While (($startrw <= $endrw) AND (!$rsmpic->EOF)) { //开始重复内容?>

<td>
<table width="78%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="../<?php echo $rsmpic->Fields('M_Path'); ?>" border="0"></td>
</tr>
</table>

</td>

<?php
$startrw = $startrw 1;
$rsmpic->MoveNext();}//以上重复td内容 ?>

</tr>

<?php $numrows=$numrows-1;
Wend; } //重复内容结束 ?>
</table>


方法二. 将重复标记拖到<td>外(纵向重复是在<tr>外),加入一个变量, 每重复 1 次加 1, 假如%3等于0 echo 一个"<tr>" . 请仔细看




<table width="100%" border="1" cellspacing="1" cellpadding="5">
<tr>
<?php $str=0;// 开始定义重复函数?>
<?php do { //开始重复?>

<td>
<?php $str ;?>
<?php echo $str; ?>.<?php echo $row_Recordset1['NAME']; ?>
</td>
<?php if ($str%3==0)echo "<tr>"; ?>

<?php } while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)); // 重复td内容?>
</tr>

</table>

<?PHP
//====================================================
//        FileName:    snap.class.php
//        Summary:    网页快照类
//        Author:        millken(迷路林肯)
//        LastModifed:2007-06-29
//        copyright (c)2007 [email]millken@gmail.com[/email]
//====================================================
class snap{
    var $dir;
    var $log;
    var $contents;
    var $filename;
    var $host;
    var $name;
    var $data_ts;
    var $ttl;
    var $url;
    var $ts;
    function snap(){
        $this->log = "New snap() object instantiated.<br />n";  
        $this->dir = dirname(__FILE__)."/";
    }
    function fetch($url="",$ttl=10){
        $this->log .= "--------------------------------<br />fetch() called<br />n";
        $this->log .= "url: ".$url."<br />n";
        $hosts = parse_url($url);
        $this->host = $hosts['scheme'].'://'.$hosts['host'].'/';
        if (!$url) {
            $this->log .= "OOPS: You need to pass a URL!<br />";
            return false;
        }
        $this->ttl = $ttl;
        $this->url = $url;
        $this->name = md5($this->url);
        $this->filename = $this->dir.$this->name;
        $this->log .= "Filename: ".$this->filename."<br />";
        $this->getFile_ts();
        $this->file_get_content();

    }
    function file_get_content(){
        ob_start();
        $this->ts = time() - $this->data_ts;
        if($this->data_ts <>0 && $this->ts <= $this->ttl){
            $this->log .= "cache has expired<br />";
            @readfile($this->filename);  
            $this->contents = ob_get_contents();
            ob_end_clean();
        }else{
            $this->log .= "cache hasn't expired<br />";       
            @readfile($this->url);  
            $this->contents = ob_get_contents();
            ob_end_clean();
            $this->saveToCache();
        }
        return true;
    }
    function saveToCache(){
        $this->log .= "saveToCache() called<br />";
        //create file pointer
        if (!$fp=@fopen($this->filename,"w")) {
            $this->log .= "Could not open ".$this->filename."<br />";
            return false;
        }
        $this->contents = $this->formaturl($this->contents,$this->host);
        $this->contents = preg_replace("'<script[^>]*?>.*?</script>'si","",$this->contents);
        //write to file
        if (!@fwrite($fp,$this->contents)) {
            $this->log .= "Could not write to ".$this->filename."<br />";
            fclose($fp);
            return false;
        }
        //close file pointer
        fclose($fp);
        return true;
    }
    function getFile_ts(){
        $this->log .= "getFile_ts() called<br />";
        if (!file_exists($this->filename)) {
            $this->data_ts = 0;
            $this->log .= $this->filename." does not exist<br />";
            return false;
        }
        $this->data_ts = filemtime($this->filename);
        return true;
    }
    function formaturl($l1,$l2){
    if (preg_match_all("/(<img[^>]+src=\"([^\"]+)\"[^>]*>)|(<link[^>]+href=\"([^\"]+)\"[^>]*>)|(<a[^>]+href=\"([^\"]+)\"[^>]*>)|(<img[^>]+src='([^']+)'[^>]*>)|(<a[^>]+href='([^']+)'[^>]*>)/i",$l1,$regs)){
      foreach($regs[0] as $num => $url){
       $l1 = str_replace($url,$this->lIIIIl($url,$l2),$l1);
      }
    }
    return     $l1;
    }

    function lIIIIl($l1,$l2){
    if(preg_match("/(.*)(href|src)=(.+?)( |/>|>).*/i",$l1,$regs)){$I2 = $regs[3];}
    if(strlen($I2)>0){
      $I1 = str_replace(chr(34),"",$I2);
      $I1 = str_replace(chr(39),"",$I1);
    }else{return $l1;}
    $url_parsed = parse_url($l2);
    $scheme      = $url_parsed["scheme"];if($scheme!=""){$scheme = $scheme."://";}
    $host      = $url_parsed["host"];  
    $l3       = $scheme.$host;
    if(strlen($l3)==0){return $l1;}
    $path      = dirname($url_parsed["path"]);if($path[0]=="\"){$path="";}
    $pos      = strpos($I1,"#");
    if($pos>0) $I1 = substr($I1,0,$pos);
    //判断类型
    if(preg_match("/^(http|https|ftp):(//|\\)(([w/\+-~`@:%])+.)+([w/\.=?+-~`@':!%#]|(&)|&)+/i",$I1)){return $l1; }//http开头的url类型要跳过
    elseif($I1[0]=="/"){$I1 = $l3.$I1;}//绝对路径
    elseif(substr($I1,0,3)=="../"){//相对路径
          while(substr($I1,0,3)=="../"){
       $I1 = substr($I1,strlen($I1)-(strlen($I1)-3),strlen($I1)-3);
       if(strlen($path)>0){
        $path = dirname($path);
       }
      }
      $I1 = $l3.$path."/".$I1;
    }
    elseif(substr($I1,0,2)=="./"){
      $I1 = $l3.$path.substr($I1,strlen($I1)-(strlen($I1)-1),strlen($I1)-1);
    }
    elseif(strtolower(substr($I1,0,7))=="mailto:"||strtolower(substr($I1,0,11))=="java script:"){
      return $l1;
    }else{
      $I1 = $l3.$path."/".$I1;
    }
    return str_replace($I2,"\"$I1\"",$l1);
    }
}
?>
 

用法test.php:

 <?php
require_once(dirname(__FILE__).'/snap.class.php');
$h = new snap();
$h->fetch($_GET['url']);
//echo $h->log;
echo $h->contents;
?>

flex+php在线拍照

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="100%"  xmlns:ns1="*" backgroundGradientColors="[#ecf9ff, #ecf9ff]" height="100%"  xmlns:ns2="view.*" creationComplete="initApp()">
  <mx:Style>
        Alert{font-size:12px;}
    </mx:Style>
    <mx:Script>
        <![CDATA[
            import mx.events.CloseEvent;
            import mx.rpc.events.FaultEvent;
            import mx.rpc.events.ResultEvent;
            import mx.controls.Alert;
             import mx.managers.CursorManager;
            private static const DEFAULT_CAMERA_WIDTH:Number = 160; //摄像头显示宽度
            private static const DEFAULT_CAMERA_HEIGHT:Number = 120; //摄像头显示高度
            private static const DEFAULT_WEBSERVICE_URL:String = "http://localhost:1888/Web/TestWebService.asmx?WSDL"; //WebService地址
           
            private var m_camera:Camera; //定义一个摄像头
            private var m_localVideo:Video; //定义一个本地视频
            private var m_pictureBitmapData:BitmapData //定义视频截图
            private var pic_width:int;
            private var pic_height:int;
            //[Bindable]
            private var m_pictureData:String;
           
            private function initApp():void
            {
                t_btn_Shooting.enabled = false;
                t_ban_Save.enabled = false;
                initCamera();
               pic_height=m_camera.height;
               pic_width=m_camera.width;
            }
           
            //初始化摄像头
            private function initCamera():void
            {
                m_camera = Camera.getCamera();
                if(m_camera != null)
                {
                    m_camera.addEventListener(StatusEvent.STATUS,__onCameraStatusHandler);
                   
                    m_camera.setMode(DEFAULT_CAMERA_WIDTH,DEFAULT_CAMERA_HEIGHT,30);
                    m_localVideo = new Video();
                    m_localVideo.width = DEFAULT_CAMERA_WIDTH;
                    m_localVideo.height = DEFAULT_CAMERA_HEIGHT;
                    m_localVideo.attachCamera(m_camera);
                    t_vd_Video.addChild(m_localVideo);
                }
                else
                {
                    Alert.show("没有找到摄像头,是否重新查找。","提示:",Alert.OK|Alert.NO,this,__InitCamera);
                    return;
                }
            }
           
            //拍照按钮事件,进行视频截图
            private function SnapshotPicture():void
            {
                m_pictureBitmapData = new BitmapData(DEFAULT_CAMERA_WIDTH,DEFAULT_CAMERA_HEIGHT);
                m_pictureBitmapData.draw(t_vd_Video,new Matrix());
               
                var m_pictureBitmap:Bitmap = new Bitmap(m_pictureBitmapData);
                t_img_Picture.addChild(m_pictureBitmap);
               
                t_panel_Picture.visible = true;
                t_ban_Save.enabled = true;
            }
           
            //保存按钮事件,保存视频截图
            //通过WebService保存
            private function SavePicture():void
            {
                m_pictureData = "";
                //m_pictureBitmapData.setPixel(1,1,6558750);
                //label1.text=m_pictureBitmapData.getPixel(1,1).toString();
               
                for(var i:int = 0; i < DEFAULT_CAMERA_WIDTH; i++)
                {
                    for(var j:int = 0; j < DEFAULT_CAMERA_HEIGHT; j++)
                    {
                        if(m_pictureData.length > 0)
                        {
                            m_pictureData += "," + m_pictureBitmapData.getPixel(i,j).toString();
                        }
                        else
                        {
                            m_pictureData = m_pictureBitmapData.getPixel(i,j).toString();
                        }
                    }
                }
                service.getOperation("createjpeg").send(pic_width,pic_height,m_pictureData);
               // t_ws_SavePicture.SavePicture.send();
              
            }
            internal function faultHandler(evt:FaultEvent):void{
   //labelresult.text="error";
   CursorManager.removeBusyCursor();
   Alert.show("保存出错","提示",Alert.YES,this);
   
  }
  internal function createImage(evt:ResultEvent):void{
      //dg_article.dataProvider=evt.result; 
      CursorManager.removeBusyCursor();
   Alert.show("保存成功","提示",Alert.YES,this);
   var date:Date=new Date();
   this.left.headerphoto.source="http://www.tiyi88.com/image/header/0.jpg?id="+date.getMilliseconds();
  }
            //检测摄像头权限事件
            private function __onCameraStatusHandler(event:StatusEvent):void
            {
                if(!m_camera.muted)
                {
                    t_btn_Shooting.enabled = true;
                }
                else
                {
                    Alert.show("无法链接到活动摄像头,是否重新检测。","提示:",Alert.OK|Alert.NO,this,__InitCamera);
                }
                m_camera.removeEventListener(StatusEvent.STATUS,__onCameraStatusHandler);
            }
           
            //当摄像头不存在,或连接不正常时重新获取
            private function __InitCamera(event:CloseEvent):void
            {
                if(event.detail == Alert.OK)
                {
                    initApp();
                }
            }
        ]]>
    </mx:Script>
    <mx:RemoteObject id="service" fault="faultHandler(event)" showBusyCursor="true"
              source="image" destination="amfphp">
  <!--定义远程方法-->
  <mx:method name="createjpeg" result="createImage(event)"/>
  </mx:RemoteObject>
 <ns1:header x="137" y="10">
 </ns1:header>
 <ns1:left1 x="137" y="158" id="left">
 </ns1:left1> 
  <mx:Panel x="406" y="158" width="180" height="232" layout="absolute" title="视频拍照" fontSize="12">
        <mx:VideoDisplay id="t_vd_Video" width="160" height="146"/>
        <mx:ControlBar horizontalAlign="right">
            <mx:Button id="t_btn_Shooting" label="拍照" click="SnapshotPicture()"/>
        </mx:ControlBar>
    </mx:Panel>
    <mx:Panel id="t_panel_Picture" x="647" y="158" width="180" height="232" layout="absolute" title="拍照图片" fontSize="12" visible="false">
        <mx:Image id="t_img_Picture" x="0" y="0" width="160" height="144"/>
        <mx:ControlBar  horizontalAlign="right">
            <mx:Button id="t_ban_Save" label="保存" click="SavePicture()" />
        </mx:ControlBar>
    </mx:Panel>
</mx:Application>

绘制头像文件:

<?php
class Image{
 
 public function createjpeg($width,$height,$bitmap_data)
 {
  $img=imagecreatetruecolor($width,$height);
  $m_tempPics=explode(',',$bitmap_data);
   for ($i = 0; $i < $width; $i++)
            {
                for ($j = 0; $j < $height; $j++)
                {
                    $pic_argb =(int) $m_tempPics[$i * $height + $j];
                    imagesetpixel($img,$i,$j,$pic_argb);
                }
            }
        imagejpeg($img,"../../image/header/0.jpg");
        imagedestroy($img);
        return true;
 }
}
?>



昨天用flex+php做了一个在线拍照的小东东,可以实现会员头像的实时在线拍照更新。
首先来讲一讲原理:
1、将camera的内容显示在video中,这个不懂的参考actionscript的手册,里面有详细的讲解以及代码,
2、定义一下BitmapData对象,
m_pictureBitmapData = new BitmapData(DEFAULT_CAMERA_WIDTH,DEFAULT_CAMERA_HEIGHT);
然后将video的内容写进BitmapData对象里, m_pictureBitmapData.draw(video,new Matrix());
3、从左到右,从上到下,一个像素一个像素的读取BitmapData的rgb值,所有的rgb值用","分开,写进一个字符串里,
for(var i:int = 0; i < DEFAULT_CAMERA_WIDTH; i++)
                {
                    for(var j:int = 0; j < DEFAULT_CAMERA_HEIGHT; j++)
                    {
                        if(m_pictureData.length > 0)
                        {
                            m_pictureData += "," + m_pictureBitmapData.getPixel(i,j).toString();
                        }
                        else
                        {
                            m_pictureData = m_pictureBitmapData.getPixel(i,j).toString();
                        }
                    }
                }
                service.getOperation("createjpeg").send(pic_width,pic_height,m_pictureData);//用amfphp进行保存
4、在服务端就把那些rgb值提取出来,一个像素一个像素的画点:
$img=imagecreatetruecolor($width,$height);
  $m_tempPics=explode(',',$bitmap_data);
   for ($i = 0; $i < $width; $i++)
            {
                for ($j = 0; $j < $height; $j++)
                {
                    $pic_argb =(int) $m_tempPics[$i * $height + $j];
                    imagesetpixel($img,$i,$j,$pic_argb);
                }
            }
        imagejpeg($img,"../../image/header/0.jpg");
        imagedestroy($img);
        return true;
5、详细的源码在附件里面,前面只是些重要提示代码。嗯,要懂得amfphp,还有flex。
还有什么不清楚的,
下面来看看 test.html文件
if ( hasProductInstall && !hasRequestedVersion ) {
 // MMdoctitle is the stored document.title value used by the installation process to close the window that started the process
 // This is necessary in order to close browser windows that are still utilizing the older version of the player after installation has completed
 // DO NOT MODIFY THE FOLLOWING FOUR LINES
 // Location visited after installation is complete if installation is required
 var MMPlayerType = (isIE == true) ? "ActiveX" : "PlugIn";
 var MMredirectURL = window.location;
    document.title = document.title.slice(0, 47) + " - Flash Player Installation";
    var MMdoctitle = document.title;
 AC_FL_RunContent(
  "src", "playerProductInstall",
  "FlashVars", "MMredirectURL="+MMredirectURL+'&MMplayerType='+MMPlayerType+'&MMdoctitle='+MMdoctitle+"",
  "width", "100%",
  "height", "100%",
  "align", "middle",
  "id", "hphoto",
  "quality", "high",
  "bgcolor", "#869ca7",
  "name", "hphoto",
  "allowScriptAccess","sameDomain",
  "type", "application/x-shockwave-flash",
  "pluginspage", "http://www.adobe.com/go/getflashplayer"
 );
} else if (hasRequestedVersion) {
 // if we've detected an acceptable version
 // embed the Flash Content SWF when all tests are passed
 AC_FL_RunContent(
   "src", "hphoto",
   "width", "100%",
   "height", "100%",
   "align", "middle",
   "id", "hphoto",
   "quality", "high",
   "bgcolor", "#869ca7",
   "name", "hphoto",
   "flashvars",'historyUrl=history.htm%3F&lconid=' + lc_id + '',
   "allowScriptAccess","sameDomain",
   "type", "application/x-shockwave-flash",
   "pluginspage", "http://www.adobe.com/go/getflashplayer"
 );
  } else {  // flash is too old or we can't detect the plugin
    var alternateContent = 'Alternate HTML content should be placed here. '
   + 'This content requires the Adobe Flash Player. '
    + '<a href=http://www.adobe.com/go/getflash/>Get Flash</a>';
    document.write(alternateContent);  // insert non-flash content
  }
// -->
</script>
<noscript>
   <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
   id="hphoto" width="100%" height="100%"
   codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab">
   <param name="movie" value="hphoto.swf" />
   <param name="quality" value="high" />
   <param name="bgcolor" value="#869ca7" />
   <param name="allowScriptAccess" value="sameDomain" />
   <embed src="hphoto.swf" quality="high" bgcolor="#869ca7"
    width="100%" height="100%" name="hphoto" align="middle"
    play="true"
    loop="false"
    quality="high"
    allowScriptAccess="sameDomain"
    type="application/x-shockwave-flash"
    pluginspage="http://www.adobe.com/go/getflashplayer">
   </embed>
 </object>

我们先把上面拆解出来的功能完成!
1。透明层(显示与隐藏)
关键是要同时设置下面这几个样式,才能使主流浏览器上都现实透明的效果。

filter= 'Alpha(Opacity=50)';
MozOpacity ='0.5';
opacity='0.5';


可能很多人都知道,类似这种在透明层上现实东西的效果,多源至于一个称为lightbox的效果。这里我也这样命名:

function Lightbox(id)
{
        this.box = this.createBox();
        this.id  = id||'lightbox_id';
}
Lightbox.prototype=
{
        createBox:function(){
                var box = document.getElementById(this.id)||document.createElement('div');
                box.id = box.id||this.id;
                with(box.style){
                        position='absolute';
                        left='0';
                        top='0';
                        width='100%';
                        height='100%';
                        zIndex='1000';
                        background='#ccc';
                        filter= 'Alpha(Opacity=50)';
                        MozOpacity ='0.5';
                        opacity='0.5';
                        display='none';
                }
                document.body.appendChild(box);
                return box;
        },
        show:function(){
                this.box.style.height= document.documentElement.scrollHeight+'px';
                this.box.style.display = '';
        },
        hide:function(){
                this.box.style.display = 'none';
        }
}


2。表单提交(ajax或iframe)
迅雷上的是用的iframe,我们这里先说iframe
iframe就简单多了,form的target属性设置为某个iframe的name就可以了。设置iframe的onload属性,那么当表单提交完成以后他就会执行相应处理。

<!--表单上的设置-->
<form id="login_form" action="login.php" target="login_submit_iframe" method="post">
<!--iframe上的设置-->
<iframe name="login_submit_iframe" id="login_submit_iframe" style="display:none;" width="0" height="0" ></iframe>


如果用ajax的话,代码也很简单。可能大家用的js框架不一样。但绝大多数都大同小异,我相信大家一看就知道是什么意思。
类我就不在这列举了,我只写一下怎么用它。
这其实就是ajax in action这本书上的那个net类。

/*很多人可能会说,为什么没用encodeURIComponent避免乱码?这里不需要使用encodeURIComponent了,在类里面调用过了*/
/**
* 'login.php':登陆验证页[废话]
*  Login.checkLogin:ajax回调函数[废话]
*  loadXMLDoc的参数,表单里要传递的数据[废话]
*/

new Ajax('login.php',Login.checkLogin).loadXMLDoc({
        username:document.getElementById('username').value,
        password:document.getElementById('password').value,
        vcode:document.getElementById('vcode').value
});


3。select的显示与隐藏,以及cookie操作。
既然select不能被div挡住,那就把他干掉吧!

var Select={
        show:function(){
                var selects=document.getElementsByTagName('select');
                for(var m=0;m<selects.length;m++) selects[m].style.visibility="visible";       
        },
        hide:function(){
                var selects=document.getElementsByTagName('select');
                for(var m=0;m<selects.length;m++) selects[m].style.visibility="hidden";       
        }
}


还要准备一套cookie函数
网络最大的好处:对于某些问题,你只需知道该干什么就可以了,至于具体该怎么做已经有人帮你做好了。
下面我就随便在论坛里搜了一下,就找到了一个
http://www.111cn.net/bbs/view ... a=page=1&sid=4jSn3r

var Cookie=
{
        check:function(){
                 //判断cookie是否开启
                 var cookieEnabled=(navigator.cookieEnabled)? true : false;
                 //如果浏览器不是ie4+或ns6+
                 if (typeof navigator.cookieEnabled=="undefined" && !cookieEnabled){
                  document.cookie="testcookie";
                  cookieEnabled=(document.cookie=="testcookie")? true : falsedocument.cookie="";
                 }
                
                 //如果没有开启
                 if(cookieEnabled){
                  return true;
                 }else{
                  return false;
                 }
        },
        add:function(name,value,expireHours){
                 var cookieString=name+"="+escape(value);
                 //判断是否设置过期时间
                 if(expireHours>0){
                  var date=new Date();
                  date.setTime(date.getTime+expireHours*3600*1000);
                  cookieString=cookieString+"; expire="+date.toGMTString();
                 }
                 document.cookie=cookieString;
        },
        get:function(name){
                 var strCookie=document.cookie;
                 var arrCookie=strCookie.split("; ");
                 for(var m=0;m<arrCookie.length;m++){
                     var arr=arrCookie[m].split("=");
                     if(arr[0]==name){
                           return unescape(arr[1]);
                     }
                 }
                 return false;
        },
        del:function(name){
                 var date=new Date();
                 date.setTime(date.getTime()-10000);
                 document.cookie=name+"=; expire="+date.toGMTString();
        }

}


4。前面提到的回调函数以及后台的两个页面
最后再说一下前面提到的回调函数Login.checkLogin。登陆后你需要做什么,写在Login.loginSuccess里就行了,最后为了方便使用稍有改变。

/*这里没有检验是否支持cookie,在login弹出的时候检测了.不支持cookie的话,登陆窗口都弹不出来。*/
var Login=
{
        statu: 0,
         /*这就是里登陆成功的话,需要做的处理。通常是把整个页面登陆前后不同的地方处理一下。你可以重载一下*/
        loginSuccess:function(){
                document.getElementById('login_result').innerHTML=Cookie.get('username')+'已经登陆';
                alert('登陆成功了!');
        },
         /*这就是里登陆失败的话,需要做的处理。通常是把整个页面登陆前后不同的地方处理一下。你可以重载一下*/
        loginOutSuccess:function(){
                document.getElementById('login_result').innerHTML=Cookie.get('username')+'刚成功退出';
                alert('退出成功!');
        },
        checkLogin:function(){
                if(Login.statu==1&&Cookie.get('loginStatu')==1){
                        new LoginDialog('login_box').hide();
                        Login.loginSuccess();
                }else if(Login.statu==2&&Cookie.get('loginStatu')==0){
                        Login.statu=0;
                        Login.loginOutSuccess();
                }else if(Login.statu==1){
                        alert('请检查你的用户名,密码以及验证码!');
                }
        },
        getVcode:function(){
        document.getElementById('verify_code').src='vcode.php?cachetime='+new Date().getTime();
        },
        loginOut:function(){
                Login.statu=2;
                document.getElementById('login_submit_iframe').contentWindow.location='loginout.php';
        }
}


后台的代码我就不细说了,各自系统有各自的区别。我这里把测试用的代码贴出来,并说一下这些文件该做什么,你只要保证的你页面有这些作用就行了。


<?php
/**
* header里设置的字符编码格式要和你前台的一致,否则当出现双字节字符的时候就会出现乱码.
* 其他的都可以用setCookie的方式,写在cookie里传到前台。
* 其中标志登陆成功的 'loginStatu'必须设为1,其他的就看你的登陆是怎么处理的了
*/
header('content-type:text/html; charset=utf-8');
session_start();
$username = 'phpchina';
$password = 'phpchina';
if($username==$_POST['username']&&$password==$_POST['password']&&$_SESSION['vcode']==$_POST['vcode']){
        setcookie('username','phpchina');
        setcookie('loginStatu','1');
}?>

 

/*验证码程序就不用说了吧!我这里是测试用的,所以就随便截了个时间做验证码*/
<?php
session_start();
$_SESSION['vcode'] = substr(time(),-4);
$im = imagecreatetruecolor(40, 20);
$bg = imagecolorallocate($im, 225, 225, 225);
$textcolor = imagecolorallocate($im, 0, 0, 0);
imagefill($im,1,1,$bg);
imagestring($im, 5, 0, 0, $_SESSION['vcode'], $textcolor);
header("Content-type:image/jpeg");
imagejpeg($im);
?>

最后看看LoginDialog类理解全过程:

function LoginDialog(formid)
{
    this.dialog = document.getElementById(formid||'login_box');
    this.overDiv = this.overDiv ||new Lightbox();
}
LoginDialog.prototype =
{
    show:function(){
        if(!Cookie.check()){alert('你的浏览器不支持cookie,无法正常登陆');return}
        else if(Cookie.get('loginStatu')==1){alert('你已经登陆!');return}
        Login.statu=1;
        this.overDiv.show();
        Select.hide();
        Login.getVcode();
        this.dialog.style.display='';
    },
    hide:function(){
        Login.statu=0;
        this.overDiv.hide();
        Select.show()
        this.dialog.style.display='none';
    }
}


主要是看show()
hide()只是还原操作

//当不支持cookie的时候提示错误,并退出
if(!Cookie.check()){alert('你的浏览器不支持cookie,无法正常登陆');return}

//当支持cookie而cookie.loginstatu的值为1时,说明已经登陆。就不用重复登陆了。
else if(Cookie.get('loginStatu')==1){alert('你已经登陆!');return}

//设置Login.statu=1;表示当前正在做登陆操作
Login.statu=1;

//透明背景层显示
this.overDiv.show();

//隐藏select
Select.hide();

//刷新验证码
Login.getVcode();

//显示登陆窗口
this.dialog.style.display='';
在完成以上这些步骤以后,就是分为iframe还是ajax两种方式提交表单了。
而提交完表单后:
如果是iframe形式提交,iframe的onload事件会调用Login.checkLogin(),当check成功时,他会对应调用Login.loginSuccess()和Login.loginOutSuccess()
而ajax则是把Login.checkLogin做为回调函数来激活。
因此,登陆成功后具体做什么由 Login.loginSuccess()和Login.loginOutSuccess()决定。使用的时候,重载一下它们就可以了。

[!--infotagslink--]

相关文章