5

我使用的是 jquery.form 插件，它工作正常，但是当更改输入值时.. 它提交得很好！但是将我重定向到我的 uploader.php 文件，我不想重定向我，我需要在 div.result 中获得结果，

要了解我，请查看我的代码：

HTML

<form id="uploader" action="uploader.php" method="post" enctype="multipart/form-data">
    <input id="file" type="file" name="uploader" value="" draggable="true">
    <input name="submit" type="submit" class="submit" value="Upload">
    <div class="result"></div>
</form>

uploader.php 文件：

<?php
    if( isset($_POST['submit']) and $_SERVER['REQUEST_METHOD'] == "POST" ){
        echo 'done!';
    }
?>

jQuery代码：

jQuery(document).ready(function() {

    $('#uploader').change(function(){

        $(".result").html('');

        $(".result").html('wait..');

        $("#uploader").ajaxForm({
            target: '.result',
            success: function() 
            {
                $('.result').hide().slideDown('fast');
                $('#uploader')[0].reset();
            },

        });

    });

});

我需要在 .result div 中回显“完成”，我不想将我重定向到 uploader.php 页面。

4

3 回答 3

0

当您更改输入值时，它实际上是否在做任何事情？我的意思是提交表格吗？还是只有在您单击提交按钮时才会发生这种情况？

在我看来，您的脚本并没有真正做任何事情。它侦听表单元素上的 onchange 事件，但根据我的经验，该事件永远不会在<form>. 因此，您只需提交一个 HTML 表单，无需借助脚本。

最重要的是，出于安全原因，我不确定您是否可以提交带有脚本的 multipart/form-data 表单。也许我错了，但不管怎样，使用 iframe 怎么样？

<form id="uploader" action="uploader.php" method="post" enctype="multipart/form-data" target="resultframe">
    <input id="file" type="file" name="uploader" value="" draggable="true">
    <input name="submit" type="submit" class="submit" value="Upload">
    <div class="result"><iframe name="resultframe" onload="$('.result').hide().slideDown('fast');"></iframe></div>
</form>

老实说，我不知道这些天 onload 是否可以在 iframe 上工作，我已经好几年没有尝试过了。如果做不到这一点，删除<div class="result">相应的</div>并将它们与动画脚本一起放入 uploader.php 的输出中。

于 2015-11-14T00:30:53.160 回答
0

使用 .ajaxSubmit({})

jQuery(document).ready(function() {

    $('#file').change(function() {

        $(".result").html('');
        $(".result").html('wait..');

        $("#uploader").ajaxSubmit({
            target: '.result',
            success: function() 
            {
                $('.result').hide().slideDown('fast');
                $('#uploader')[0].reset();
            },
        });

    });

});

谢谢大家。

于 2015-11-14T14:26:03.023 回答
0

由于您的表单的操作是uploader.php，所以页面在提交后将被重定向到uploader.php。所以您需要更改操作并使用 ajax 来更新 div.result。检查这些链接一次。 http://www.formget.com/form-submission-using-ajax-php-and-javascript/ http://blog.teamtreehouse.com/uploading-files-ajax

于 2015-11-15T14:13:55.860 回答