1

ファイル入力、アップロード ボタン、キャンセル ボタンを含むフォームがあります。

アップデート： 

    <form action='imageupload.php' method='post' enctype='multipart/form-data' target='upload_target' onsubmit='stopImageUpload(this);' class='imageuploadform' >
    <p class='imagef1_upload_form' align='center'><label>Image File: <input name='fileImage' type='file' class='fileImage' /></label>
    <input type='submit' name='submitImageBtn' class='sbtnimage' value='Upload' /></label>
    </p>
    <p class='imagef1_cancel' align='center'>
    <label><input type='button' name='imageCancel' class='imageCancel' value='Cancel' /></label>
    </p> 
<p><span class='list></span></p>
    <iframe class='upload_target' name='upload_target' src='#' style='width:0;height:0;border:0px;solid;#fff;'></iframe>
    </form>

今私が欲しいのは、画像のアップロードが完了した場合、このフォームの下部にアップロードされたファイルの名前が欲しいということです。これは可能ですか？たとえば、Images/file1.png をアップロードすると、アップロード後に file1.png という名前が下部に保存され、user/file2.jpg をアップロードすると、file2.jpg という名前が file1.png の下に保存されます。

私は、phpとjavascriptで整理されたファイルをアップロードしています。以下は、アップロードが完了した後の JavaScript コードです。

       $(document).ready(function(){
    $('.fileImage').bind('change', handleFileSelect, false);
});

function handleFileSelect(evt) {
    var files = evt.target.files;
    localStorage["fname"] = files[0].name; //save the name for future use
}
function stopImageUpload(success){
      var result = '';
      if (success == 1){
  result = '<span class="msg">The file ('+localStorage["fname"]+') was uploaded successfully!</span><br/><br/>';
    localStorage["fname"] = undefined; //remove the temporary variable

      }
      else {
         result = '<span class="emsg">There was an error during file upload!</span><br/><br/>';
      }

      return true;   
}
4

1 に答える 1

0

JavaScript のやり方

最新のブラウザー (IE6789 はもうありません) をターゲットにしている場合は、File APIがファイル名を取得するのに適しています。使いやすく、コードを混乱させることはありません。

私が作成したデモをチェックしてください: http://jsfiddle.net/xUzcS
これはあなたが望むものですか?

しかし、古い IE6 をサポートしたい場合は、申し訳ありませんが、AJAX を使用するか、VBscript を使用する必要があります。(非推奨)

追加した

function handleFileSelect(evt) {
    var files = evt.target.files;
    localStorage["fname"] = files[0].name; //save the name for future use
}

document.getElementById('files').addEventListener('change', handleFileSelect, false);​

それで：

if (success == 1){
    result = '<span class="msg">The file ('+localStorage["fname"]+') was uploaded successfully!</span><br/><br/>';
    localStorage["fname"] = undefined; //remove the temporary variable
}

私はhtml全体を知らないので、これでうまくいくかもしれません。

于 2012-04-16T02:17:15.473 に答える