Ajax 生成流文件下载以及复选框的实现

浏览数：24 / 时间：2015年06月09日

JQuery的ajax函数的返回类型只有xml、text、json、html等类型，没有“流”类型，所以我们要实现ajax下载，不能够使用相应的ajax函数进行文件下载。但可以用js生成一个form，用这个form提交参数，并返回“流”类型的数据。在实现过程中，页面也没有进行刷新。

<th><input type="checkbox" name="title" id="checkbox_all"/></th>
{% for student in students %}
    <tr>
       <td><input type="checkbox" name="student_name" id="boxes" value="{{ student.number }}"/></td>

$(‘#checkbox_all‘).click(function () {
                    var a = document.getElementsByTagName("input");
                    if (document.getElementById("checkbox_all").checked == true) {
                        for (var i = 0; i < a.length; i++)
                            if (a[i].type == "checkbox") a[i].checked = true;
                    }
                    else {
                        for (var i = 0; i < a.length; i++)
                            if (a[i].type == "checkbox") a[i].checked = false;
                    }

                }
        );

$(‘#input_student‘).click(function () {
                var arr = new Array();
                var sign = 0;
                var inputs = document.getElementsByTagName(‘input‘);//获取所有的input标签对象。
                for (var i = 0; i < inputs.length; i++) {
                    var obj = inputs[i];
                    if (obj.type == ‘checkbox‘) {
                        if (obj.checked == true) {
                            sign = 1;
                            var length = arr.push(obj.value);
                        }
                    }
                }
                if (sign == 0)//没有被选择项
                {
                    alert("请勾选要下载的数据！");
                    return;
                }
                if (!confirm("确定下载选中的条目吗？")) return;
                var form = $("<form>");
                form.attr(‘style‘, ‘display:none‘);
                form.attr(‘target‘, ‘‘);
                form.attr(‘method‘, ‘post‘);
                form.attr(‘action‘, ‘{% url "teacher:downloadStu" %}‘);
                var input1 = $(‘<input>‘);
                input1.attr(‘type‘, ‘hidden‘);
                input1.attr(‘name‘, ‘number‘);
                input1.attr(‘value‘, arr.join("&"));
                $(‘body‘).append(form);
                form.append(input1);
                form.submit();
                form.remove();
                });