フォームフィールドファイルアップロードファイルやPHPのバックグラウンド処理
1.htmlコードセクション：
フォームフォーム、chechbox、ラジオ、ファイルのフィールド、ドロップダウンボックスやその他のコンポーネントは、スタイルのスタイルを変更することはできませんので、見た目の良いするために、最初の自分のスタイルを変更します
基本的な考え方：
- アバター、次に入力しましょう：まず、ラベルの入力を結合アバター表示：なし。このラベルをクリックすると、ファイル・ドメインを選択することができるようになります
- I IMGして、ラベルを追加し、ブロッキング層の空IMGが行われたときに、ここでヘッドの後に提出ディスプレイIMGに使用され、私が使用されています
- 彼らは長さと幅を持っているので、IMGスタイルの変更とI、
- 最後に、書き込み入力：隠された、それは隠されたフィールドですが、フォームから送信背景画像アドレスにユーザーが送信を保存することができますページ表示、フォームにデータを提出するために使用することはできません
<フォームクラス= "水平フォーム" METHOD = "POST" ACTION = "/ ADMIN / -the add.phpユーザ">
<DIV CLASS = "フォームグループ">
<ラベルクラス=「COL。3-SM-CONTROL-ラベル">アバター</ label>は
<DIV CLASS =" COL-SM-6 ">
<！ -ここでは、デフォルトのスタイルファイルを変更するには、画像フレームが送信ボタンをだ- >
<ラベルクラス="フォーム画像「>
<INPUT =述べたIDタイプの「アバター」=「ファイル」>上記
<IMG SRC =「HTTP：//baixiu.test/static/assets/img/default.png」>
< -フィールド:!目に見えないテキストボックスに隠れがにありますキー提出する- >
<INPUTの種類を= "隠された"名前= "アバター">
<Iクラス= "アップロードはマスクFA-FA"></ I>
</ label>は
</ DIV>
</ DIV>
</フォーム>
2.jsコードセクション：
フォーカスいるFormData（）オブジェクトフォーマットによってキーとバイナリデータにファイルをもたらすことです
ファイルが送信されたときに、ドメイン用のファイルに//使用形式、ファイル・ドメインも変更イベントをトリガーしました。
//入力用：ファイル要素、提出された書類は、DOMプロパティファイルに格納されている、あなたが提出されていません。このプロパティによって判断することができ、および要素へのアクセスは、提出
に$（「＃アバターを」） （「変更」機能。 （）{
//ファイル選択状態の変更時にイベントハンドラを実行
VAR = $ $これ（この）;
VARファイル= $（この）.prop（ 'ファイル'）;
//長さがコミットされていないを示し、0であればファイル
IF {（files.length！）
リターン;
}
//ユーザーから提出されたファイルを取得
するvarファイルファイル= [0];
//非同期のファイルアップロードを================= ===========================================
//いるFormDataは、新しいHTML5ですクライアントとサーバー間でバイナリデータを転送するための特別なAJAX操作を持つメンバー、
VARいるFormData新新データ=（）;
//キーの方法として保存
data.append（ 'アバター'、ファイル）;
//カプセル化されていないAJAXによって、より便利に、しかし不便な使用JQにAJAXを介して、サーバに送信された
VAR =新しい新しいXHRのXMLHttpRequest（）;
'POST'（xhr.open、 '/admin/api/upload.php'）;
xhr.send（データ）; //バイナリファイルの形式は、バックグラウンドに送信
xhr.onload =関数（）{
//はconsole.log（this.responseText）;
$この.siblings（ 'IMG'）のattr（ 'SRC'、this.responseText）;.
$ this.siblings（ 'INPUT'）ヴァル（this.responseText）;.
}
}）
</ SCRIPT>
3.PHP背景コードセクション：
このセクションでは、最初の$ _FILESとアバター用のキーデータを受信し、その中で各項目の意味を学びます
アップロードに成功かどうかを確認し、新しいアドレスにファイルを保存
このアドレスは、クライアントに返され、クライアントは、写真を通じてこの問題に対処することができるようになりますimgタグ＆新しいユーザデータベース内の対応するアドレスを表示
<？PHPが
//サーバが実行する
//ファイルを受け取る
//ファイルの保存
//戻り、ファイルアクセスURL
IF（空（$ _ FILES [ 'アバター']））{
終了（ 'ファイルをアップロードする必要があります'）;
}
アバター_FILES = $ $ [「アバター」];
//アバター結合、キーと値のバイナリコンテンツを介して渡されるが、それは、直接印刷値連想配列である場合
、//配列（5）{
// [ "名前"] =>
元の名前//文字列（12） "widget_5.jpg"クライアントファイル。
// [ "タイプの"] =>
//文字列（10）MIMEタイプ"イメージ/ JPEG"ファイルは、あなたがサポートにこの情報を提供する必要が
// [ "tmp_name"] =>
//文字列（27）「C ：\ WINDOWS \一時\ php68F1.tmp「ファイルは、サーバーのアップロード一時ファイル名、通常はシステムのデフォルトに格納された後。php.iniで指定することができますupload_tmp_dir
// [「エラー」] =>ファイルとアップロードされたエラーコード
// INT（0）
// [ "
} //
//ファイルが正常にアップロードするかどうか、だけ$アバター[「エラー」] UPLOAD_ERR_OK等しい、それが成功したアップロードを示し
// UPLOAD_ERR_OK
//値：0;エラーは発生しません、ファイルのアップロードを成功裏。
UPLOAD_ERR_INI_SIZE //
//値：1;アップロードされたファイルは、の値を制限するphp.iniのオプションのupload_max_filesizeを超えています。
UPLOAD_ERR_FORM_SIZE //
//値：2;アップロードファイルのサイズは、HTMLフォームを指定する値MAX_FILE_SIZEオプションを超えています。
UPLOAD_ERR_PARTIAL //
//値：3;ファイルが部分的にしかアップロードされました。
UPLOAD_ERR_NO_FILE //
//値：4;いいえ、ファイルがアップロードされませんでした。
@：5; 0ザ・のアップロードファイルのサイズ
IF {（！アバター$ [ 'エラー'] == UPLOAD_ERR_OK）
出口（ '失敗したファイル'）;
}
//サイズ、種類を確認
//サイトにファイルを移動範囲外
//パス情報（）連想配列は、経路情報が含まれて返します。例えば：
//配列
//（
// [DIRNAME] => / testweb
// [ベース名] => test.txtの
// [拡張] => TXT
//）
//ここで画像ファイル名の接尾辞=> JPG取得するために
$ EXT =パス情報を（$アバター[ '名前']、PATHINFO_EXTENSION）;
// uniqid（）関数はマイクロ秒に基づいていますそれはユニークなIDを生成し、現在の時間のカウント。
//スプライシング新しいアドレス
uniqid（）$ EXTの$ターゲット= '../../static/uploads/img-' .. '' ;.が
新しい場所に// move_uploaded_fileアップロードファイル。成功した場合は、そうでない場合はfalse、trueを返します。
{IF（move_uploaded_file（アバター$ [ 'tmp_name']、$ターゲット）！）
出口（ 'アップロードに失敗した'）;
}
//正常にアップロード、切片への実際の必要に応じてアドレス文字列
エコーのsubstr（$ターゲット、5） ;