欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

jquery实现动态创建form并提交的方法示例

程序员文章站 2023-10-24 10:57:16
本文实例讲述了jquery实现动态创建form并提交的方法。分享给大家供大家参考,具体如下: 有时候在写web 应用的时候,需要临时动态构造一个form 并提交,form...

本文实例讲述了jquery实现动态创建form并提交的方法。分享给大家供大家参考,具体如下:

有时候在写web 应用的时候,需要临时动态构造一个form 并提交,form 里面的参数以及action,以及是post请求还是get请求,甚至form 的样式都是可以指定的,用原生的javascript  肯定可以做到,我用jquery做了一个测试。

我自己测试的是构造一个分页的post请求, 为了防止csrf 攻击,加入了csrf 验证,不需要的可以去掉.

function gensearchobj(url,page,pagesize,keyword){
  var params = {};
  params.url = url;
  params.page = page;
  params.pagesize = pagesize;
  params.cond = keyword;
  return params;
}
function mockformsubmit(params){
  var form = $('<form />', {action : params.url, method:"post", style:"display:none;"}).appendto('body');
  $.each(params, function(k, v) {
     if ( k != "url" ){
       form.append('<input type="hidden" name="' + k +'" value="' + v +'" />');
     }
  });
  form.append('<input type="hidden" name="csrftoken" value="' + $("#csrf_token").val() + '" />' );
  form.submit();
}

这样就动态构造了一个form ,并提交。

附:js动态创建form表单并提交的方法

var dlform = document.createelement('form');
dlform.style = "display:none;";
dlform.method = 'post';
dlform.action = '../fileservlet';
dlform.target = 'callbacktarget';
var hdnfilepath = document.createelement('input');
hdnfilepath.type = 'hidden';
hdnfilepath.name = 'filepath';
hdnfilepath.value = filepath;
dlform.appendchild(hdnfilepath);
document.body.appendchild(dlform);
dlform.submit();
document.body.removechild(dlform);

更多关于jquery相关内容感兴趣的读者可查看本站专题:《jquery form操作技巧汇总》、《jquery操作json数据技巧汇总》、《jquery常用插件及用法总结》、《jquery扩展技巧总结》、《jquery表格(table)操作技巧汇总》及《jquery选择器用法总结

希望本文所述对大家jquery程序设计有所帮助。