ホームページ > ウェブフロントエンド > htmlチュートリアル > 単一ファイルのアップロードと部分ページのrefresh_html/css_WEB-ITnoseの実装

単一ファイルのアップロードと部分ページのrefresh_html/css_WEB-ITnoseの実装

WBOY
リリース: 2016-06-24 11:51:40
オリジナル
1270 人が閲覧しました

ページを更新せずに単一ファイルのアップロードを実現

1.html


action="fjFileInsert.action" onsubmit= " return check()" target="fjUploadIFrame">




< ; ul id="fj" class="fileList">

fjFileInsert.action はファイルのアップロードを実行し、データを upLoad.html ページに返します。upLoad.html ページは、 iframe
実行後、iframe が再読み込みされます。このとき、onload イベント内で後続の操作がいくつか処理されます

2.upLoad.html


3 .js

// iframe の onload イベントが初めてトリガーされないようにします
var doFlag = false;

// アップロードする必要があるファイルが選択されているかどうかを判断します
関数チェック(){
var file=document.forms["fjUploadForm "].doc;
if(file.value==""){
alert("アップロードするファイルを選択してください!");
file.focus() ;
return false;
}
doFlag = true;
return true;
}

//ファイルがアップロードされた後、iframe の onload イベントをトリガーし、戻り値に基づいて後続の処理を実行します
関数 iframeOnLoad( ){
if(doFlag){
var doc = window.frames[" fjUploadIFrame"].document;
var text = doc.getElementById("result").value;
var arr = text.split(',') ;
var msg = arr[0];
if(msg == " 1"){
alert("添付ファイルは正常にアップロードされました!");
AddLi("fj",arr[1],arr[2])
}else if(msg == "2"){
alert("アップロード上限は【50MB】です! rnアップロードに失敗しました! ");
}else if(msg=="3"){
alert("アップロードされたファイルが存在しないか、ファイルの入力形式が間違っています!rn アップロードに失敗しました!");
}
else if(msg= =" 4"){
alert("アップロードされたファイルは 0kb 未満で空のファイルです。もう一度選択してください。");
}
doFlag = false
}
}

//getContent.action を実装します。ファイルダウンロード
function AddLi (targetId,id,name){
$("#"+targetId).append("

  • < input type='hidden ' value='"+name+"'>"+name+"< ;/a>
  • ");
    }

    function deTr(obj){
    $(obj) .parent().parent().remove();
    }

    ソース:php.cn
    このウェブサイトの声明
    この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
    最新の問題
    人気のチュートリアル
    詳細>
    最新のダウンロード
    詳細>
    ウェブエフェクト
    公式サイト
    サイト素材
    フロントエンドテンプレート