同一页面多个Uploadify实例+表单提交示例



<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>同一页面多个Uploadify实例+表单提交示例 - MZWU.COM</title>
    <link type="text/css" rel="stylesheet" href="/Scripts/uploadify/uploadify.css" />
    <script type="text/javascript" src="/Scripts/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="/Scripts/uploadify/jquery.uploadify.min.js"></script>
</head>
<body>
    <input type="file" id="file1" />
    <input type="file" id="file2" />
    <input type="button" id="btnUpload" value="Upload" />

    <script type="text/javascript">
        $(document).ready(function () {
            //1.要上传的文件数
            var uploadfiles = 0;
            //2.提交表单相关方法
            var submit = function () {
                if (uploadfiles == 0) {
                    /*
                    *   提交表单
                    */
                    alert("表单提交成功!");
                }
            };
            $("#btnUpload").click(function () {
                //uploadfiles = $("#file1-queue > div").length + $("#file2-queue > div").length;
                uploadfiles = window["uploadify_file1"].queueData.queueLength + window["uploadify_file2"].queueData.queueLength;
                if (uploadfiles > 0) {
                    $("#file1").uploadify("upload", "*");
                    $("#file2").uploadify("upload", "*");
                }
                else {
                    submit();
                }
            });
            //3.Uploadify配置
            var settings = {
                swf: "/Scripts/uploadify/uploadify.swf",
                uploader: "/Upload.ashx",
                auto: false,
                onUploadSuccess: function () {
                    uploadfiles--;
                    submit();
                }
            };
            $("#file1").uploadify(settings);
            $("#file2").uploadify(settings);
        });
    </script>
</body>
</html>


评论: 0 | 引用: 0 | 查看次数: 7498
发表评论
登录后再发表评论!