1
$(function() {
    $(".preview").click(function() {
        $('#image').wrap('<form action="/index/upload.php" method="post" enctype="multipart/form-data" id="imageform" target="imageupload" />');
        $('#imageform').submit();
        $('#image').unwrap();
        var image = $('#imageupload').filename;
        return false;
    });
});

<iframe style="display: none;" name="imageupload" id="imageupload"></iframe>
<input type="file" id="image" name="image">
<input type="button" value="Preview" class="preview">

在上面的代码中,图像提交到服务器后,它在 iframe 中创建了一个变量,供我检索,其中包含上传的图像的文件名。我遇到的问题是,当检索文件名时,jQuery 的 .submit() 函数在提交表单时没有任何回调,因此在上传图像时,我的代码尝试在文件名不存在时获取文件名。有谁知道我可以解决这个问题的方法?

4

1 回答 1

1

我发现 iframe 本身有一个 onload 事件,因此我能够在提交到 iframe 后触发此事件,并且在文件上传后代码继续执行。

$(function() {
   $(".preview").click(function() {
       $('#image').wrap('<form action="/index/upload.php" method="post" enctype="multipart/form-data" id="imageform" target="imageupload" />');
        $('#imageupload').attr('onload', 'preview()');
        $('#imageform').submit();
        $('#image').unwrap();
        return false;
   });
});
function preview() {
    var image = $('#imageupload').contents().find('#filename').html();
}


<iframe style="display: none;" onload="" name="imageupload" id="imageupload"></iframe>
<input type="file" id="image" name="image">
<input type="button" value="Preview" class="preview">
于 2012-04-05T22:22:04.943 回答