1

以下は画像入力フォームです。

 var $fileImage = $("<form action='imageupload.php' method='post' enctype='multipart/form-data' target='upload_target_image' onsubmit='return imageClickHandler(this);' class='imageuploadform' >" + 
"<input type='hidden' class='numimage' name='numimage' value='" + numimage + "' />" +
"<div class='display_content_image'>" +
"<p class='imagef1_upload_process' align='center'>Loading...<br/><img src='Images/loader.gif' /><br/></p>" +
"<p class='imagef1_upload_form' align='center'><br/><label>" + 
"Image File: <input name='fileImage' type='file' class='fileImage' /></label><br/><br/><label class='imagelbl'>" + 
"<input type='submit' name='submitImageBtn' class='sbtnimage' value='Upload' /></label>" + 
"</p><p class='imagef1_cancel' align='center'><label>" +
"<input type='reset' name='imageCancel' class='imageCancel' value='Cancel' /></label>" +
"</p><p class='listImage' align='left'></p>" +
"<iframe class='upload_target_image' name='upload_target_image' src='#' style='width:300px;height:300px;border:0px;solid;#fff;'></iframe></div></form>");

$image.append($fileImage);

以下は、画像ファイルのアップロードを開始する完全な jquery コードです。

 function startImageUpload(imageuploadform){

      $(imageuploadform).find('.imagef1_upload_process').css('visibility','visible');
      $(imageuploadform).find('.imagef1_cancel').css('visibility','visible');
      $(imageuploadform).find('.imagef1_upload_form').css('visibility','hidden');

      $(imageuploadform).find('.imagef1_upload_form').find('.display_content_image')
           .css('visibility','hidden');
      sourceImageForm = imageuploadform;

      $(imageuploadform).find(".imageCancel").on("click", function(event) {
           $('.upload_target_image').get(0).contentwindow
           $("iframe[name='upload_target_image']").attr("src", "javascript:'<html></html>'");
           return stopImageUpload(2);        
      });    

      return true;
}

以下は、画像ファイルのアップロードを停止する完全な jquery コードです。

 function stopImageUpload(success, imagefilename){

      var result = '';
      imagecounter++;

      var replaceForm = function(result) { 
           $(sourceImageForm).find('.imagef1_upload_form').html(result + '<label>Image File: <input name="fileImage" class="fileImage" type="file"/></label><br/><br/><label><input type="submit" name="submitImageBtn" class="sbtnimage" value="Upload" /></label><label><input type="button" name="imageClear" class="imageClear" value="Clear File"/></label>');
      } 

      var updateForm = function(result) { 
           $(sourceImageForm).find('.imagef1_upload_form').find('.display_content_image').html(result);
      } 

    var displayInfo;

      if (success === 1){
           result = '<span class="imagemsg'+imagecounter+'">The file was uploaded successfully</span><br/><br/>';      
           $('.listImage').eq(window.lastUploadImageIndex).append('<div>' + htmlEncode(imagefilename) + '<button type="button" class="deletefileimage" image_file_name="' + imagefilename + '">Remove</button><br/><hr/></div>'); 
           displayInfo = replaceForm;      
      }
      else if (success === 2){
           result = '<span class="imagemsg'+imagecounter+'"> The file upload was canceled</span><br/><br/>';
           displayInfo = updateForm;    
      }
      else {
           result = '<span class="imagemsg'+imagecounter+'">There was an error during file upload</span><br/><br/>';
           displayInfo = updateForm;  
      }
      displayInfo(result); 

      $(sourceImageForm).find('.imagef1_upload_process').css('visibility','hidden');
      $(sourceImageForm).find('.imagef1_cancel').css('visibility','hidden');
      $(sourceImageForm).find('.imagef1_upload_form').css('visibility','visible');               
 });

問題は、ファイルが正常にアップロードされた場合、キャンセルされた場合、またはアップロードに失敗した場合に成功時にメッセージが表示されない場合ですresult = '<span class="imagemsg'+imagecounter+'"> The file upload was canceled</span><br/><br/>';。メッセージが表示されない理由を知っている人はいますか。

また、ユーザーがファイルを正常にアップロードすると、アップロードされたファイルの名前がファイル入力の下に表示され、その横に削除ボタンが表示されますが、これも表示されません。これも表示されない理由を誰か知っていますか？

これが突然起こったのは、divタグをフォームに含めたときだと思いますが、display_content_imageそのために何を変更する必要があるかについては訴えていません

4

0 に答える 0