js动态生成Html元素实现Post操作(createElement)


Posted in Javascript onSeptember 14, 2015

有时,你需要Post数据到另一个页面上,那么你就需要构建一个Form表单

<form id="postform" name="postform" method="post">
<input name="msg" value=""/>
</form>
document.write("<form ..."

//document.write("<iframe src=\"about:blank\" name=\"hiddenFrame\" id=\"hiddenFrame\" width=\"0\" height=\"0\" frameborder=\"0\"></iframe>");

用如下js提交不起作用,因为打到页面上的form不是一个对象,而是一个字符串

//  theForm.action = "http://msg.baihe.com/tortoise/pages/tortoise/sm_gb2312.jsp?ReturnURL="+strReturnURL;
//  document.getElementById("Pathid").value="3070";
//  document.getElementById("Title").value="你好!";
//  document.getElementById("Content").value="我把你设为重点关注了,咱们聊聊吧:)";
//  document.getElementById("CloseWindow").value="1";

所以你需要自己动态创建form对象,用如下方法实现:

var form_feedback = document.createElement("form");
  document.body.appendChild(form_feedback);
    
  var i = document.createElement("input");
  i.type = "hidden";
  i.name = "Title";
  i.value = "你好!";
  form_feedback.appendChild(i);
  
  
  var j=document.createElement("input");
  j.type="hidden";
  j.name="Content";
  j.value="我把你设为重点关注了,咱们聊聊吧:)";
  form_feedback.appendChild(j);
  
  var hiddenIframe=document.createElement("iframe");
  hiddenIframe.src="about:blank";
  hiddenIframe.name="hiddenFrame";
  hiddenIframe.id="hiddenFrame";
  hiddenIframe.width="0";
  hiddenIframe.height="0";
  hiddenIframe.frameborder="0";
  form_feedback.appendChild(hiddenIframe);
  
  
  form_feedback.action = "http://msg.baihe.com/tortoise/pages/tortoise/sm_gb2312.jsp?ReturnURL=";
  form_feedback.target = "hiddenFrame";
  form_feedback.method = "post";
  form_feedback.submit();
Javascript 相关文章推荐
js DOM的学习笔记
Dec 22 Javascript
jquery删除指定的html标签并保留标签内文本内容的方法
Apr 02 Javascript
JS实现CheckBox复选框全选全不选功能
May 06 Javascript
js实现带按钮的上下滚动效果
May 12 Javascript
基于Arcgis for javascript实现百度地图ABCD marker的效果
Sep 12 Javascript
在localStorage中存储对象数组并读取的方法
Sep 24 Javascript
详解ES6中的let命令
Apr 05 Javascript
JS二叉树的简单实现方法示例
Apr 05 Javascript
vue系列之动态路由详解【原创】
Sep 10 Javascript
node中间层实现文件上传功能
Jun 11 Javascript
vue+element实现表格新增、编辑、删除功能
May 28 Javascript
JavaScript如何处理移动端拍摄图片旋转问题
Nov 16 Javascript
IE9+已经不对document.createElement向下兼容的解决方法
Sep 14 #Javascript
JS动态添加iframe的代码
Sep 14 #Javascript
javascript实现在指定元素中垂直水平居中
Sep 13 #Javascript
window.onload使用指南
Sep 13 #Javascript
JS+CSS简单树形菜单实现方法
Sep 12 #Javascript
纯js代码实现未知宽高的元素在指定元素中垂直水平居中显示
Sep 12 #Javascript
JS实现超精简响应鼠标显示二级菜单代码
Sep 12 #Javascript
You might like
PHP程序员最常犯的11个MySQL错误小结
2010/11/20 PHP
thinkphp视图模型查询提示ERR: 1146:Table 'db.pr_order_view' doesn't exist的解决方法
2014/10/30 PHP
linux中cd命令使用详解
2015/01/08 PHP
[原创]PHP实现生成vcf vcard文件功能类定义与使用方法详解【附demo源码下载】
2017/09/02 PHP
基于swoole实现多人聊天室
2018/06/14 PHP
零基础php编程好学吗
2019/10/11 PHP
在IE浏览器中resize事件执行多次的解决方法
2011/07/12 Javascript
js实现的常用的左侧导航效果
2013/10/17 Javascript
javascript实现的元素拖动函数宿主为浏览器
2014/07/21 Javascript
JavaScript中的object转换成number或string规则介绍
2014/12/31 Javascript
JS简单实现城市二级联动选择插件的方法
2015/08/19 Javascript
jquery实现漂亮的二级下拉菜单代码
2015/08/26 Javascript
JavaScript中数组添加值和访问值常见问题
2016/02/06 Javascript
JQuery ztree带筛选、异步加载实例讲解
2016/02/25 Javascript
Javascript实现一个简单的输入关键字添加标签效果实例
2017/06/01 Javascript
Vue入门之animate过渡动画效果
2018/04/08 Javascript
javascript深拷贝、浅拷贝和循环引用深入理解
2018/05/27 Javascript
layer.msg()去掉默认时间,实现手动关闭的方法
2019/09/12 Javascript
Nodejs封装类似express框架的路由实例详解
2020/01/05 NodeJs
JS图片懒加载的优点及实现原理
2020/01/10 Javascript
Python中pygame的mouse鼠标事件用法实例
2015/11/11 Python
教你用 Python 实现微信跳一跳(Mac+iOS版)
2018/01/04 Python
TensorFlow实现MLP多层感知机模型
2018/03/09 Python
对Pandas MultiIndex(多重索引)详解
2018/11/16 Python
python用插值法绘制平滑曲线
2021/02/19 Python
python 画图 图例自由定义方式
2020/04/17 Python
详解Scrapy Redis入门实战
2020/11/18 Python
HTML5之消息通知的使用(Web Notification)
2018/10/30 HTML / CSS
美味咖啡的顶级烘焙师:Cafe Britt
2018/03/15 全球购物
TripAdvisor斯洛伐克:阅读评论、比较价格和酒店预订
2018/04/25 全球购物
库存图片、照片、矢量图、视频和音乐:Shutterstock
2021/02/12 全球购物
决定成败的关键——创业计划书
2014/01/24 职场文书
学校督导评估方案
2014/06/10 职场文书
2014大学班主任工作总结
2014/11/08 职场文书
感谢信模板大全
2015/01/23 职场文书
2016年元旦致辞
2015/08/01 职场文书