1

ファイルアップロードフォームがあります：

<form method="post" enctype="multipart/form-data">
  <input type="file" name="image_1" /> 
  <input type="submit" name="upload_photo" id="upload_photo" />
</form>

ファイルをアップロードする php スクリプトがありますが、大きなファイルをアップロードするたびに、フォームが送信されてページがリロードされるまでに最大 10 秒かかる場合があることに気付きました。ユーザーが送信をクリックした後、送信ボタンをメッセージに置き換えたいと思います。私はこれを機能させるいくつかのjQueryを書きました:

$("#upload_photo").click(function() {                       
  $("#upload_photo").replaceWith('<p>Image is uploading. Please wait...</p>');                      
});

これは送信ボタンを問題なく置き換えますが、問題は、ファイル アップロード フィールドが空の場合でも、送信ボタンも置き換えてしまうことです。したがって、ユーザーが送信ボタンをクリックした後、フィールド アップロード フィールドに値があるかどうかを確認し、ある場合はボタンをメッセージに置き換える必要があります。私はここでそれを試しました：

if($_FILES['image_1']['tmp_name'] != '') {
  $image_uploaded = true;
}

if($image_uploaded == true) { //If a file has been uploaded
  echo '<script type="text/javascript">
      $("#upload_photo").replaceWith("<p>The image is uploading. Please wait...</p>");
        </script>
  ';
}

残念ながら、それは機能せず、送信ボタンを置き換えずにファイルがアップロードされます。.replaceWith 行をアラートに置き換えてみましたが、フォームは画像をアップロードし、ページをリロードしてから、遅すぎるアラートを表示します。

ファイルアップロードフィールドが空かどうかを確認した後、送信ボタンを置き換えるにはどうすればよいですか?

4

2 に答える 2

4

ファイル入力フィールドに値があるかどうかを確認するだけです

if ($("[name=image_1]").val()){
    $("#upload_photo").replaceWith('<p>Image is uploading. Please wait...</p>'); 
}
于 2012-07-02T02:48:38.263 に答える
0

私はしばしばこれを行うことでこれを処理します:

1) 送信ボタンを無効にする

$(this).attr('disabled', 'disabled')

2) 送信ボタンのテキストを変更します。

$(this).attr('value', 'Please wait ...')

これはこれのjsfiddleです。

http://jsfiddle.net/Vqyc6/8/

于 2012-07-02T03:04:12.540 に答える