php 폼 파일 iframe 비동기 업로드 인 스 턴 스 설명
1.폼 에 iframe 요 소 를 배치 합 니 다.
2.파일 업로드 컨트롤 내용 이 변 했 을 때 JS 설정 폼 의 action 을 실행 하여 파일 업로드 의 img 처리upload_process.php 파일 을 사용 하고 폼 의 target 을 iframe 으로 설정 하여 iframe 을 서버 에 제출 하여 파일 을 업로드 하도록 합 니 다.
3.img_upload_process.php 에서 파일 업로드 에 성공 하면 저 장 된 파일 경 로 를 폼 에 숨겨 진 도 메 인 에 전송 합 니 다.
4.폼 제출 버튼 을 눌 렀 을 때 JS 는 폼 액 션 을 폼 데 이 터 를 받 는 form 로 설정 합 니 다.process.php 파일,폼 의 target 설정self。
폼:asynuplaod.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> </title>
</head>
<body>
<!-- application/x-www-form-urlencoded -->
<!-- multipart/form-data , post ， -->
<form action="" method="post" enctype="multipart/form-data">
: <input type="text" name="username" /><br />
: <input type="file" id="avator" name="avator" onchange="startUpload(this.form)" />
<iframe frameborder='0' width='0' height='0' name="uploadframe"></iframe>
<input type="hidden" id="save_path" name="save_path" />
<span id="loading"></span> <br />
<img width='100' height='100' id='uploaded_img' /> <br />
<input type="submit" name="submitted" value=" " onclick="formSubmit(this.form)" />
</form>
<script>
function startUpload(formObj){
document.getElementById('loading').innerHTML = ' ...';
formObj.action = 'img_upload_process.php';
formObj.target = 'uploadframe';
formObj.submit();
}
function formSubmit(formObj) {
formObj.action = 'form_process.php';
formObj.target = '_self';
// ，
var fileObj = document.getElementById('avator') ;
// for IE, Opera, Safari, Chrome
if (fileObj.outerHTML) {
fileObj.outerHTML = fileObj.outerHTML;
} else { // FF( 3.5)
fileObj.value = "";
}
formObj.submit();
}
</script>
</body>
</html>
<?php
include 'Upload.class.php';
$file = $_FILES['avator'];
$upload = new Upload();//
if($save_path = $upload->up($file)){//
echo <<<STR
<script>
window.parent.document.getElementById('uploaded_img').src = "$save_path";
window.parent.document.getElementById('loading').innerHTML = ' ';
window.parent.document.getElementById('save_path').value = "$save_path";
</script>
STR;
}else{
$error = $upload->error();
echo <<<STR
<script>
window.parent.document.getElementById('uploaded_img').src = "";
window.parent.document.getElementById('loading').innerHTML = " : $error";
</script>
STR;
}
<?php
class Upload{
private $path; //
private $max_size; //
private $errno; //
private $mime = array('image/jpeg','image/png','image/gif');//
/**
* ,
* @access public
* @param $path string
*/
public function __construct($path = './' ){
$this->path = $path;
$this->max_size = 1000000;
}
/**
* ，
* @access public
* @param $file array
* @return mixed ， false
*/
public function up($file){
// HTTP POST ，
/*
if (! is_uploaded_file($file['tmp_name'])) {
$this->errno = 5; // 5，
return false;
}
*/
//
if ($file['error'] == 0) {
# ,
//
if (!in_array($file['type'], $this->mime)) {
#
$this->errno = -1;
return false;
}
//
if ($file['size'] > $this->max_size) {
#
$this->errno = -2;
return false;
}
//
$sub_path = date('Ymd').'/';
if (!is_dir($this->path . $sub_path)) {
# ，
mkdir($this->path . $sub_path);
}
// , + +
$file_name = date('YmdHis').uniqid().strrchr($file['name'], '.');
// ，
if (move_uploaded_file($file['tmp_name'], $this->path . $sub_path . $file_name)) {
#
return $sub_path . $file_name;
} else {
#
$this->errno = -3;
return false;
}
} else {
# ，
$this->errno = $file['error'];
return false;
}
}
/**
*
* @access public
* @param $file array ，
* @return array , ?
*/
public function multiUp($files){
// ， ， $_FILES['userfile']['name'][0]，$_FILES['userfile']['name'][1]
// ， ， up
foreach ($files['name'] as $key => $value) {
# code...
$file['name'] = $files['name'][$key];
$file['type'] = $files['type'][$key];
$file['tmp_name'] = $files['tmp_name'][$key];
$file['error'] = $files['error'][$key];
$file['size'] = $files['size'][$key];
// up ，
$filename[] = $this->up($file);
}
return $filename;
}
/**
* ,
* @access public
* @return string
*/
public function error(){
switch ($this->errno) {
case -1:
return ' ， '.implode(',', $this->mime);
break;
case -2:
return ' ， '. $this->max_size;
break;
case -3:
return ' ';
break;
case 1:
return ' php.ini upload_max_filesize , '.ini_get('upload_max_filesize');
break;
case 2:
return ' HTML MAX_FILE_SIZE , ' . $_POST['MAX_FILE_SIZE'];
break;
case 3:
return ' ';
break;
case 4:
return ' ';
break;
case 5:
return ' ';
break;
case 6:
return ' ';
break;
case 7:
return ' ';
break;
default:
return ' , ';
break;
}
}
}
<?php
var_dump($_REQUEST);
var_dump($_FILES);
폼 제출 단 추 를 누 르 면 결과:
코드 다운로드:php 폼 파일 iframe 비동기 업로드
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Laravel - 변환된 유효성 검사 규칙으로 API 요청 제공동적 콘텐츠를 위해 API를 통해 Laravel CMS에 연결하는 모바일 앱(또는 웹사이트) 구축을 고려하십시오. 이제 앱은 CMS에서 번역된 콘텐츠를 받을 것으로 예상되는 다국어 앱이 될 수 있습니다. 일반적으로 ...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
