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 相关文章推荐
图片之间的切换
Jun 26 Javascript
js遍历td tr等html元素
Dec 13 Javascript
JQuery实现鼠标滑过显示导航下拉列表
Sep 12 Javascript
什么是 AngularJS?AngularJS简介
Dec 06 Javascript
JAVA四种基本排序方法实例总结
Jul 24 Javascript
Position属性之relative用法
Dec 14 Javascript
微信小程序 vidao实现视频播放和弹幕的功能
Nov 02 Javascript
webpack 2.x配置reactjs基本开发环境详解
Aug 08 Javascript
JavaScript折半查找(二分查找)算法原理与实现方法示例
Aug 06 Javascript
vue 集成jTopo 处理方法
Aug 07 Javascript
JS FormData对象使用方法实例详解
Feb 12 Javascript
vue实现移动端div拖动效果
Mar 03 Vue.js
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
全国FM电台频率大全 - 18 湖南省
2020/03/11 无线电
跟我学Laravel之视图 &amp; Response
2014/10/15 PHP
php天翼开放平台短信发送接口实现方法
2014/12/22 PHP
yii2.0整合阿里云oss上传单个文件的示例
2017/09/19 PHP
jqgrid 编辑添加功能详细解析
2013/11/08 Javascript
解析Javascript中中括号“[]”的多义性
2013/12/03 Javascript
jquery实现的伪分页效果代码
2015/10/29 Javascript
浅析JS原型继承与类的继承
2016/04/07 Javascript
使用bootstrap typeahead插件实现输入框自动补全之问题及解决办法
2016/07/07 Javascript
浅谈javascript:两种注释,声明变量,定义函数
2016/10/05 Javascript
简单谈谈gulp-changed插件
2017/02/21 Javascript
Bootstrap modal 多弹窗之叠加关闭阴影遮罩问题的解决方法
2017/02/27 Javascript
jQuery实现字体颜色渐变效果的方法
2017/03/29 jQuery
jQuery实现的手动拖动控制进度条效果示例【测试可用】
2018/04/18 jQuery
vue3.0 CLI - 2.6 - 组件的复用入门教程
2018/09/14 Javascript
详解基于electron制作一个node压缩图片的桌面应用
2019/01/29 Javascript
小程序实现搜索界面 小程序实现推荐搜索列表效果
2019/05/18 Javascript
Nodejs libuv运行原理详解
2019/08/21 NodeJs
详谈Object.defineProperty 及实现数据双向绑定
2020/07/18 Javascript
Python压缩解压缩zip文件及破解zip文件密码的方法
2015/11/04 Python
用python标准库difflib比较两份文件的异同详解
2018/11/16 Python
Python的高阶函数用法实例分析
2019/04/11 Python
Python基于Opencv来快速实现人脸识别过程详解(完整版)
2019/07/11 Python
Python脚本操作Excel实现批量替换功能
2019/11/20 Python
详细分析Python垃圾回收机制
2020/07/01 Python
CSS3的column-fill属性对齐列内容高度的用法详解
2016/07/01 HTML / CSS
THE OUTNET英国官网:国际设计师品牌折扣网站
2016/08/14 全球购物
漫威玩具服装及周边商品官方购物网站:Marvel Shop
2019/05/11 全球购物
班长竞选演讲稿
2014/04/24 职场文书
宣传活动总结范文
2014/07/01 职场文书
护士工作失误检讨书
2014/09/14 职场文书
不服从公司安排检讨书
2014/09/24 职场文书
2014年污水处理厂工作总结
2014/12/19 职场文书
想要创业,那么你做好准备了吗?
2019/07/01 职场文书
教你怎么用python实现字符串转日期
2021/05/24 Python
Python借助with语句实现代码段只执行有限次
2022/03/23 Python