zoukankan      html  css  js  c++  java
  • Ajax 生成流文件下载 以及复选框的实现

    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();
                    });

    同理提交多个数据就多使用几个input.

  • 相关阅读:
    硬件调试软件
    ICMP(Internet Control Message Protocol)
    算法网站
    下载安装
    netcat 实现端口转发
    mqtt 连接工具
    Linux(CentOS7)安装zip、unzip命令
    awk 两个字符串互换位置
    创建一个swift项目
    屏幕录制
  • 原文地址:https://www.cnblogs.com/tuifeideyouran/p/4397568.html
Copyright © 2011-2022 走看看