一个伪ajax图片上传代码实现示例_AJAX相关

复制代码 代码如下:

<?php
if($_FILES){
?>
<script>
window.parent.ajaxUploadPicture.uploadCallback('yun_qi_img/5099213b07eca8065380ce7f75e95dda144ad348269.jpg');
</script>
<?php
die;
}
?>
<!DOCTYPE html>
<html>
<head>
<script>

ajaxUploadPicture = { $o1:'' };

ajaxUploadPicture.ajaxUploadFile = function ($o){
this.$o1 = $o;
var $iframe = document.createElement('iframe');
$iframe.style.display = 'none';
$iframe.name = 'iframe';
$iframe.id = 'iframe';
document.body.appendChild($iframe);

var $form = document.createElement("form");
$form.method = "post";
$form.enctype = "multipart/form-data";
$form.action = "";
$form.target = 'iframe';
$newO = $o.cloneNode();
$form.appendChild($newO);
$form.submit();
}
ajaxUploadPicture.uploadCallback = function ($url){

$pic = document.createElement('img');
$pic.width = "200";
$pic.height = "150";
$pic.src = $url;

if(document.getElementById('picshow') == null){
$div = document.createElement("div");
$div.id = 'picshow';
this.$o1.parentNode.insertBefore($div,this.$o1.nextSibling);
}else{
$div = document.getElementById('picshow');
}
$div.innerHTML = '';
$div.appendChild($pic);
};
</script>
</head>
<body>
<input type="file" name="file" onchange = "ajaxUploadPicture.ajaxUploadFile(this);">
</body>
</html>

面向对象思想,form提交到一个隐藏的iframe,执行回调js函数。实现图片回显。后台php的功能没有完善。

时间: 2024-11-16 04:55:12

一个伪ajax图片上传代码实现示例_AJAX相关的相关文章

一个伪ajax图片上传代码实现示例

 这篇文章主要介绍了自己写的一个伪ajax图片上传实现代码,需要的朋友可以参考下  代码如下: <?php  if($_FILES){  ?>  <script>  window.parent.ajaxUploadPicture.uploadCallback('http://img0.bdstatic.com/img/image/5099213b07eca8065380ce 7f75e95dda144ad348269.jpg');  </script>  <?ph

自己动手打造ajax图片上传(网上没有的)_AJAX相关

今天笔者需要一款图片上传插件,但是网上没有提供一款符合自己需求且好用的.于是就自己动手写了一个. 方法1,仅使用jquery代码,不用第三方插件.代码如下 <p> <label>上传图片</label> <input class="ke-input-text" type="text" id="url" value="" readonly="readonly" /&g

jQuery Ajax方式上传文件的方法_AJAX相关

jQuery Ajax方式上传文件用到两个对象 第一个对象:FormData 第二个对象:XMLHttpRequest 目前新版的Firefox 与 Chrome 等支持HTML5的浏览器完美的支持这两个对象,但IE9尚未支持 FormData 对象,还在用IE6 ? 只能仰天长叹.... 有了这两个对象,我们可以真正的实现Ajax方式上传文件. 示例代码: <!DOCTYPE html> <html> <head> <title>Html5 Ajax 上传

webform-求一个asp.net 图片上传压缩实例源码

问题描述 求一个asp.net 图片上传压缩实例源码 求一个asp.net 图片上传压缩实例源码,在线等哇,求大神赐教 解决方案 http://download.csdn.net/detail/zr__manong/8325629 这个是我上传的资源 是ajax无刷新上传的代码 楼主看看是不是你需要的 解决方案二: Asp.NET压缩图片 建议是保留2张图片,一张缩略图,一张原始图片..压缩图片不清楚.如果你服务器配置好,可以保留原图,用动态页读取原始图片生成需要的缩略图 解决方案三: http

简单php 图片上传代码

简单php 图片上传代码 php 上传图片代 <?php $zpname=addslashes(isset($_POST['zpname'])?$_POST['zpname']:''); $zpurl=isset($_POST['zpurl'])?$_POST['zpurl']:''; $zpsay=addslashes(isset($_POST['zpsay'])?$_POST['zpsay']:''); $blueidea=isset($_POST['blueidea'])?$_POST['

jsp图片上传代码

jsp图片上传代码 <%@ page contentType="text/html;charset=UTF-8" language="java" import="java.io.*,java.awt.Image,java.awt.image.*,com.sun.image.codec.jpeg.*, java.sql.*,com.jspsmart.upload.*,java.util.*,cn.oof.database.*,cn.oof.house.

基于firefox实现ajax图片上传_AJAX相关

图片文件上传,有很多种协议的,这次主要讲的是"Content-Type:multipart/form-data;"的形式. 在工作中前台一些静态文件是通过FTL模版系统,前台页面通过SSI进行引用的,项目开发的时候就需要生成大量的静态SHTML文件了,本来觉得应该是后台的事情,可是自从我进这公司,这快东西就交给了前端~~我表示无语,没办法就按着习惯来吧,但我是个懒人,就想着能不能通过ajax提交呢 基于平时对MDN的翻阅,今天主要是FormData这个对象解决多文件上传的协议. htt

用Fine Uploader+ASP.NET MVC实现ajax文件上传[代码示例]_实用技巧

This project attempts to achieve a user-friendly file-uploading experience over the web. It's built as a Javascript plugin for developers looking to incorporate file-uploading into their website. Fine Uploader 不依赖于 jQuery,也就是说不引用jquery.js,也可以正常使用.同时,

ajax图片上传剪切

允许用户以AJAX的方式上传图片 ·允许用户选择图片的一定区域 ·最后,提供一个裁减后图片的下载地址 我们将要用到三个文件 ·index.php - 包含图片上传表单以及剪切界面 ·upload.php - 提供上传功能 ·crop.php - 提供剪切功能 从技术角度看,流程如下所示: 1.用户上传文件(index.php) 2.index.php将上传的图片POST到upload.php以处理上传图片程序,返回JSON数据包括图片名,长和宽. 3.根据JSON里的数据和innerHTML,我