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> 
<iframe class='upload_target' name='upload_target' src='#' style='width:0;height:0;border:0px;solid;#fff;'></iframe>
</form>

ファイルをアップロードするようにphpを設定しましたが、アップロードは完全に機能します。以下のJavaScript関数のためにアップロードが開始および停止しますが、私の質問は、ユーザーがアップロード中にアップロードをキャンセルしたい場合、キャンセル ボタンをクリックすると、アップロードが停止します (stopImageUpload() 関数に移動する必要があると思いますが、これが正しいかどうかはわかりません)。

画面に正しく表示されるようにすべてを設定しました。アップロードを正常にキャンセルし、すでに stopImageUpload にある「アップロード中にエラーが発生しました」というメッセージを表示するための適切な機能を知る必要があります。 （） 関数。

以下は、アップロードが開始される関数です。

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');
  sourceImageForm = imageuploadform;
      return true;
}

以下は、アップロードが終了する関数です。

function stopImageUpload(success){
      var result = '';
      if (success == 1){
         result = '<span class="msg">The file was uploaded successfully!</span><br/><br/>';
      }
      else {
         result = '<span class="emsg">There was an error during file upload!</span><br/><br/>';
      }
      $(sourceImageForm).find('.imagef1_upload_process').css('visibility','hidden');
      $(sourceImageForm).find('.imagef1_cancel').css('visibility','hidden');

      return true;   
}
4

1 に答える 1

3

関数とクリック ハンドラーは既にあるので、イベント ハンドラー内で関数を呼び出せない理由は何でしょうか?

stopImageUpload 関数が同じファイル内にある (または少なくともそのページに読み込まれている) と仮定すると、次のようになります。

$(".imagecancel").on("click", function(event) {
    console.log("clicked");
    event.preventDefault();
    stopImageUpload(); // Just call it?!
});

また、stopImageUpload 関数で、ブラウザーが現在のリクエスト (アップロード) の送信を停止していることを確認してください。

if(navigator.appName == "Microsoft Internet Explorer") {
    window.document.execCommand('Stop');
} else {
    window.stop();
}
于 2012-04-13T22:50:14.987 に答える