ファイル名が未定義のまま表示され続ける

Question

ユーザーがファイルをアップロードした後にファイルの名前を表示しようとしています。ファイルは正常にアップロードされますが、javacriptでは次のメッセージが表示され続けます。

ファイル（未定義）が正常にアップロードされました。

ファイル名を表示する必要があるときは、未定義の表示を続けます。どうしてこれなの？現在のところ、ユーザーがファイルをアップロードし、ファイルが "ImageFiles"フォルダにアップロードされ、アップロードが完了すると、下のjavascript関数は、正常にアップロードされたファイルの名前を示すメッセージを表示します。

以下

アップロード後のファイル名やメッセージを表示するコードである：以下

function stopImageUpload(success){ 

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

$('.fileImage').bind('change', handleFileSelect, false); 


     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; 
} 

の形式である：

<form action='imageupload.php' method='post' enctype='multipart/form-data' target='upload_target' onsubmit='stopImageUpload(this);' class='imageuploadform' > 
    <p>Image File: <input name='fileImage' type='file' class='fileImage' /> 
    <input type='submit' name='submitImageBtn' class='sbtnimage' value='Upload' /> 
    </p> 
    </form> 

Answer 1

はこれを試してみてください：

var fileName; 
function stopImageUpload(success){ 

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

$('.fileImage').bind('change', handleFileSelect, false); 


     var result = ''; 
     if (success == 1){ 
    result = '<span class="msg">The file ('+fileName+') was uploaded successfully!</span><br/><br/>'; 
    fileName = ""; //remove the temporary variable 

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

     return true; 
} 

Answer 2

テストされていないが、 getItem/setItemを使ってみて、それが何か変わるかどうか見てください！

function stopImageUpload(success){ 

    function handleFileSelect(evt) { 
     var files = evt.target.files; 
     console.log(files[0].name); //see if a name really exists, or if something is wrong outside this function? 
     localStorage.setItem("fname", files[0].name); //save the name for future use 
    } 

    $('.fileImage').on('change', handleFileSelect); 

    var result = ''; 
    if (success == 1){ 
     result = '<span class="msg">The file ('+localStorage.getItem("fname")+') was uploaded successfully!</span><br/><br/>'; 
     localStorage.setItem("fname", ""); //remove the temporary variable 
    } else { 
     result = '<span class="emsg">There was an error during file upload!</span><br/><br/>'; 
    } 
    return true; 
}