用的是CI框架
后端代码：
<?php
class Upload extends MY_Controller {
function __construct() {
parent::__construct();
$this->load->helper(array('form', 'url'));
}
function index() {
$data = array();
$data['upload_url'] = site_url('upload/ajax_upload');
$this->load->view('upload', $data);
}
function do_upload() {
$config['upload_path'] = './uploads/';
$config['allowed_types'] = 'gif|jpg|png';
$config['max_size'] = '1024';
$config['max_width'] = '1024';
$config['max_height'] = '768';
$this->load->library('upload', $config);
if (!$this->upload->do_upload('AidImg')) {
echo("<script>parent.callback('" . $this->upload->display_errors() . "',false)</script>");
exit;
} else {
$data = array('upload_data' => $this->upload->data());
$img_path = base_url() . 'uploads/';
echo "<script>parent.callback('" . $data['upload_data']['file_name'] . "',true,'" . $img_path . "')</script>";
exit;
}
}
}
?>
前端代码：
<html>
<head>
<title>Upload Form</title>
<script type="text/javascript" src="<?php echo base_url() ?>access/js/jquery-1.8.0.min.js"></script>
</head>
<body>
<form id="formImg" action="do_upload" method="post" target="hidden_frame" enctype="multipart/form-data">
<div>
<input type="hidden" name="sh_id" id="sh_id" value="{$id}">
<!--这里的{$id}大家可以随便填1个进去-->
<input id="AidImg" type="file" name="AidImg" onchange="uploadImg()"/>
<div style="display:none;" id="imgError">图片不可为空</div>
<iframe style="display:none" name='hidden_frame' id="hidden_frame"></iframe>
<div><img id="p_img" src="" width="80" height="80"/> </div>
<span class="help_inline">尺寸：80*80</span>
</div>
</form>
</body>
</html>
<script>
function uploadImg()
{
var names = $("#AidImg").val().split(".");
if (names[1] != "gif" && names[1] != "GIF" && names[1] != "jpg" && names[1] != "JPG" && names[1] != "png" && names[1] != "PNG")
{
$("#imgError").html("<span>" + "图片必须为gif,jpg,png格式" + "</span>");
$("#formImg .help-inline").hide();
$("#imgError").show();
return;
}
$("#formImg").submit();
$("#imgError").show();
$("#imgError").html("图片上传中ing");
}
function callback(message, success, path)
{
if (success == false)
{
$("#imgError").html("<span>" + message + "</span>");
$("#imgError").show();
}
else {
$("#imgError").hide();
$(".fromtrs").show();
$("#formImg .help-inline").hide();
var paths = path;
$("#p_img").attr("src", path + message);
$("#p_img").attr("imgname", message); //这里由于数据库里只存入图片名称加后缀名，故和路径拆开了
}
}
</script>