Post请求跳转页面

本文介绍了一种使用jQuery在JavaScript中创建动态表单并提交的方法,解决了直接使用div元素作为富文本编辑器数据源进行POST提交的问题。通过在内存中构建form对象,并将其附加到DOM中再提交,确保了跨浏览器兼容性。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

现在的需求:

用JavaScript 控制POST的数据内容并跳转到B页面,类似ExtJS的standardSubmit功能

需求决定我们不能在页面上使用form来提交数据.因为提交的数据是页面上几个Div的全部HTML内容(实际上是富文本编辑器).使用jQuery的.html()方法取得这些HTML内容.

现在想到的思路是使用jQuery 在内存中建立一个form对象,然后调用这个对象的submit方法

$.extend({
    StandardPost:function(url,args){
        var form = $("<form method='post'></form>"),
            input;
        form.attr({"action":url});
        $.each(args,function(key,value){
            input = $("<input type='hidden'>");
            input.attr({"name":key});
            input.val(value);
            form.append(input);
        });
        form.submit();
    }
});

调用:

$.StandardPost('url/path/req',{arg0:'arg0',arg1:'arg1'});

上面这段代码有兼容性问题,在IE低版本和火狐下不通过,需要在submit前将form.appendTo(document.body),否则无法提交且不会报错,submit后应该从body中remove此结点。另建议给form加上display:none防止影响展现,最终代码如下: 

$.extend({
    StandardPost:function(url,args){
        var body = $(document.body),
            form = $("<form method='post'></form>"),
            input;
        form.attr({"action":url});
        $.each(args,function(key,value){
            input = $("<input type='hidden'>");
            input.attr({"name":key});
            input.val(value);
            form.append(input);
        });

        form.appendTo(document.body);
        form.submit();
        document.body.removeChild(form[0]);
    }
});

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值