使用AjaxFileUpload函数

时间:2014-04-16 04:47:03

标签: javascript jquery ajax forms

我正在使用AjaxFileUpload脚本,它运行良好,但我试图让它需要按下按钮。现在,在您找到要在文件浏览器上传的图像后,它会直接触发。我不知道为什么,我认为这是插件的编写方式,但也许你可以看看逻辑:

此方法有效:文件在提交后立即上传。

<form method="post" action="" enctype="multipart/form-data">
    <label>File Input: <input type="file" name="file" id="demo1" /></label>
    <div id="uploads">

    </div>
</form>
<script type="text/javascript">
    $(document).ready(function() {
        $("#demo1").AjaxFileUpload({

    });
</script>

此方法不起作用。单击“提交”按钮将不执行任何操作。但是,第二次浏览文件(第二次单击文件按钮)时,它将以与第一种方法相同的方式操作。

<form method="post" action="" enctype="multipart/form-data">
    <label>File Input: <input type="file" name="file" id="demo1" /></label>
    <div id="uploads">

    </div>
</form>
<input class = "Submit" name="Submit" type="button" value="Submit" />
<script type="text/javascript">
    $(document).ready(function() {
        $(".Submit").click(function(){
            $("#demo1").AjaxFileUpload({

            });
        });
    });
</script>

我认为我缺少一个基本的编程问题。如果您对此插件的(简短)代码感兴趣,请点击链接:https://github.com/davgothic/AjaxFileUpload/blob/master/jquery.ajaxfileupload.js

2 个答案:

答案 0 :(得分:2)

此时你可能已经解决了这个问题。但是为了其他人可以来这里寻找同一问题的答案,这就是它的完成方式。

ajaxfileupload方法调用中有一个名为 submit_button 的参数。如果设置了该选项,则在您选择文件时不会自动上传该文件。该方法实际上会等待您按下指定的按钮以进行上传。

根据您提供的示例,这样做:

在提交按钮中添加ID(尚未使用JQuery类说明符进行测试):

<input class = "Submit" name="Submit" id="Submit" type="button" value="Submit" />

然后添加 submit_button 参数:

$("#demo1").AjaxFileUpload({
    // other parameters omitted like in example provided
    'submit_button': $('#Submit')
});

答案 1 :(得分:1)

使用此:

<script type="text/javascript">
    $(document).ready(function() {
        $("#demo1").AjaxFileUpload({

            });

        $(".Submit").click(function(){
            $("#myform").submit();
        });

    });
</script>

myform 是表单的ID。

HTML:

<form method="post" action="" enctype="multipart/form-data" id="myform">
    <label>File Input: <input type="file" name="file" id="demo1" /></label>
    <div id="uploads">

    </div>
</form>
<input class = "Submit" name="Submit" type="button" value="Submit" />