zoukankan      html  css  js  c++  java
  • 模拟 Ajax 上传

    ----------------view-----------------------------------
    <form method="post" action="__SELF__">
    <input type="hidden" id="logo" size="40" name="logo" />
                       <li>
                        <label>Logo</label>
                        <img id="pre_img" />
                        <input id="selImg" type="button" value="选择图片" />
    </form>
    
    ----------------------弹出层-------------------------
    
    <iframe style="display:none;" name="ifr"></iframe>
    <div id="upload" style="position:absolute;display:none;padding:10px;border:1px solid #CCC;background:#FFF;360px;">
        <form id="pre_form" target="ifr" method="POST" action="__CONTROLLER__/ajaxUpload" enctype="multipart/form-data">
            图片:<input type="file" name="img" /><input type="submit" value="上传" />
            <a id="close" href="javascript:void(0);"> [关闭] </a>
        </form>
    </div>
    
    
    -----------------------JS--------------------------------
    
    <script>
    $("#close").click(function(){
        $("#upload").hide();
    });
    $("#selImg").click(function(){
        // 获取按钮的位置
        var p = $(this).position();
        var div = $("#upload");
        div.css({
            "left":p.left+"px",
            "top":p.top+"px",
            "display":""
        });
    });
    </script>
    
    
    --------------------------控制器-------------------
    
    //注意   Good/Temp目录需要自己手动创建
     public function ajaxUpload()
        {
            // 读取上传图片的配置
            $config = C('UPLOAD_CONFIG');
            // 设置上传路径
            $config['savePath'] = 'Goods/Temp/';
            $upload = new ThinkUpload($config);
            // 执行上传
            $info = $upload->upload();
            if(!$info)
                die($upload->getError());
            // 设置模型原图地址
            $url = 'Uploads/'.$info['img']['savepath'] . $info['img']['savename'];
            $thumb_url = 'Uploads/'.$info['img']['savepath'] . 'sm_' .$info['img']['savename'];
            $image = new ThinkImage(); 
            $image->open($url);
            $image->thumb(100, 100)->save($thumb_url);
            #设置图片显示
            $show_img="shop_tp/".$thumb_url;
            // 在子窗口中的执行JS把数据放到父窗口的表单中
            $js = '<script>';
            $js .=<<<JS
            parent.document.getElementById("logo").value='$url';
            parent.document.getElementById("pre_img").src='/$show_img';
            parent.document.getElementById("upload").style.display="none";
            parent.document.getElementById("pre_form").reset();
    JS;
            $js .= '</script>';
            echo $js;
        }
    }
  • 相关阅读:
    c#redis使用
    不安全的HTTP方法(渗透实验)
    arguments.callee弃用与webuploader
    多线程系列1:经典卖票
    终于确定了系统lsass.exe占用cpu的根本原因了,速度来看一看!![转载]
    edit响应键盘的“咚咚”声音去掉
    delphi资源文件制作及使用详解
    MySQL server has gone away错误的解决办法
    MySQL server has gone away的解决方法
    MySQL
  • 原文地址:https://www.cnblogs.com/hgj123/p/4151186.html
Copyright © 2011-2022 走看看