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 回答