POST请求到新的页面

1) 问题的提出

通过GET请求传递的参数有限,而且window.open(); 只适用于GET请求;如果通过POST请求传递参数,则需要自己封装函数来实现

2) 具体实现

⑴ 传递JSON

① 传递JSON,通过jQuery实现

    /**
     * POST请求到新的窗口,传递JSON,通过jQuery实现
     * 
     * @param url 请求路径
     * @param json JSON字符串
     */
    function postToNewTabWithJSONByjQuery(url, json) {
        var $form = $('
'); for (var param in json) { $form.append(''); } $("body").append($form); $form.submit(); $form.remove(); };

② 传递JSON,通过JavaScript实现

    /**
     * POST请求到新的窗口,传递JSON,通过JavaScript实现
     *
     * @param url 请求路径
     * @param json JSON字符串
     */
    function postToNewTabWithJSONByJavaScript(url, json) {
        var form = document.createElement("form");
        form.action = url;
        form.method = "POST";
        form.target = "_blank";
        form.style.display = "none";

        var hidden;
        for (var param in json) {
            hidden = document.createElement("input");
            hidden.type = "hidden"
            hidden.name = param;
            hidden.value = json[param];
            form.appendChild(hidden);
        }
        document.body.appendChild(form);
        form.submit();
        document.body.removeChild(form);
    };

⑵ 传递Array数组

① 传递Array数组,通过jQuery实现

    /**
     * POST请求到新的窗口,传递Array数组,通过jQuery实现
     *
     * @param url 请求路径
     * @param array Array数组
     */
    function postToNewTabWithArrayByjQuery(url, array) {
        var $form = $('
'); for (var element in array) { for (var param in array[element]) { $form.append(''); } } $("body").append($form); $form.submit(); $form.remove(); };

② 传递Array数组,通过JavaScript实现

    /**
     * POST请求到新的窗口,传递Array数组,通过JavaScript实现
     *
     * @param url 请求路径
     * @param array Array数组
     */
    function postToNewTabWithArrayByJavaScript(url, array) {
        var form = document.createElement("form");
        form.action = url;
        form.method = "POST";
        form.target = "_blank";
        form.style.display = "none";

        var hidden;
        for (var element in array) {
            for (var param in array[element]) {
                hidden = document.createElement("input");
                hidden.type = "hidden"
                hidden.name = param;
                hidden.value = array[element][param];
                form.appendChild(hidden);
            }
        }
        document.body.appendChild(form);
        form.submit();
        document.body.removeChild(form);
    };

3) 使用示例

    var url = "???";
    var person = {
        "id": "1",
        "name": "张三",
        "age": 14
    };
    postToNewTabWithJSONByjQuery(url, person);

    var url = "???";
    var array = new Array();
    var person1 = {
        "persons[0].id": "1",
        "persons[0].name": "张三",
        "persons[0].age": 14
    };
    var person2 = {
        "persons[1].id": "2",
        "persons[1].name": "李四",
        "persons[1].age": 12
    };
    array.push(person1);
    array.push(person2);
    postToNewTabWithArrayByJavaScript(url, array);

你可能感兴趣的:(JavaScript)