js创建表单元素并使用submit进行提交

js 创建form、input元素，并设置form的action及method，最后使用submit进行提交

<script src="Scripts/jquery-1.7.1.js"></script>
  <script type="text/javascript">
    function SubmitFormToSF() {
      var sfForm = document.createElement("form");
      document.body.appendChild(sfForm);
      var mfInputs = "text1,checkbox1,Select1,Hidden1";
      var sfInputs = "text1_c,checkbox1_c,Select1_c,Hidden1_c";
      var mFInputsArray = mfInputs.split(",");
      var sFInputsArray = sfInputs.split(",");
      for (i = 0; i < mFInputsArray.length; i++) {
        createInput(sfForm, "text", sFInputsArray[i], GetInputValue(document.getElementById(mFInputsArray[i])))
      }
      //创建联系时间 

      //创建隐藏域 

      sfForm.method = "post";
      sfForm.action = "c.aspx";
      sfForm.submit();
    }
    function createInput(sfForm,type,name,value)
    {
      var tmpInput = document.createElement("input");
      tmpInput.type = type;
      tmpInput.name = name;
      tmpInput.value = value;
      sfForm.appendChild(tmpInput);
    }
    function GetInputValue(ipt)
    {
      switch (ipt.type)
      {
        case "text":
          return ipt.value;
          break;
        case "hidden":
          return ipt.value;
          break;
        case "checkbox":
          return ipt.checked;
          break;
        case "select-one":
          return ipt.value;
          break;
      }
    }
    function getContratTime() {
      var anytime = $("#anytime");
      var afternoon = $("#afternoon");
      var morning = $("#morning");
      var evening = $("#evening");
      if (anytime.checked) {
        return "morning,afternoon,evening";
      } else {
        if (morning.checked)
        {
          return morning.val();
        } else if (afternoon.checked)
        {
          return afternoon.val();
        } else if (evening.checked)
        {
          return evening.val();
        }
        return "";
      }
    }
  </script>
赞 (0)

相关推荐

  • JS中的form.submit()不能提交表单的错误原因

    直接上代码把: 复制代码 代码如下: <div id="register">      <h4>会员注册</h4>      <div class="formdiv">          <form method="post" action="register.php?action=register" name="register" id="r

  • jQuery使用ajaxSubmit()提交表单示例

    ajaxSubmit(obj)方法是jQuery的一个插件jquery.form.js里面的方法,所以使用此方法需要先引入这个插件.如下所示: 复制代码 代码如下: <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script><script src="http://malsup.github.io/jquery.form.js"></script>

  • 简述JavaScript提交表单的方式 （Using JavaScript Submit Form）

    最近做项目遇到用Javascript提交表单的问题, 之前也做过几次, 但是不够全面, 这次总结出了几种用JavaScript提交表单的方式, 并且对此作出了比较, 选出了一种最适合此项目的方式. 我目前正在为Sun Communication Suite做一个创建用户的小型系统,大家都知道我们可以通过表单,Ajax 和链接来访问服务器, 最简单的方法就是使用连接, 例如:<a href=UserServlet?event=SEARCH_MAILING_LIST&currentPage=1&

  • js表单提交和submit提交的区别实例分析

    本文实例分析了js表单提交和submit提交的区别.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <

  • jquery中使用$(#form).submit()重写提交表单无效原因分析及解决

    问题:最近使用 jqeury 的 validationEngine 做ajax校验,当表单中的最后一个字段需要做ajax验证时,此时在字段输入完毕后点击回车提交表单时不起作用,必须再按一次/点击submit按钮. 分析:通过个跟踪其源代码,最终发现ajax验证成功后也再次submit了表单,但还是不能真正提交表单. 原因:很诡异,因为我的提交表单按钮名字是submit.改掉就好了. 复制代码 代码如下: <input id="submit" type="submit&q

  • JS和jQuery使用submit方法无法提交表单的原因分析及解决办法

    JS和jQuery使用submit方法无法提交表单的原因分析及解决办法

    昨天,在做一个表单异步提交内容的时候,遇到很奇怪的问题,submit()方法无法进行提交,每次提交都是把 当前给刷新了,网络抓包发现,每次都是 get方式去获取 当前页面,完全没有post 请求,想着以前 遇上这样的问题 都是因为 表单中 有 name 或者 id 这些命名跟submit 有冲突,但是检查了几次,始终没有发现 名字冲突,所以这个可能性被排除. 平常自己做触发按钮,基本不用a 标签,但是昨天不知道什么 问题,竟然用了 a 而且还给了 href 为空,由于这个a 的class 有多个

  • 解决jquery submit()提交表单提示：f[s] is not a function

    jquery submit()无法提交表单 报错:f[s] is not a function, js submit()无法提交表单 报错:document.getElementByIdx_x(...).submit is not a function 这2个错让人很无奈啊,语法没有任何错误,怎么能报错呢? 因为以前重来没有遇到过,这次是在改别人的代码,回头看了看代码,我靠原来有个按钮的name="submit",把它删掉就能正常提交表单了. 为什么呢?应该是一个type="

  • jquery实现submit提交表单

    使用jquery的submit()函数提交form表单时,总是无法提交表单.这个问题太诡异了,是因为form中提交表单的input的name属性为submit,把name改成其他的名称,就可以使用了. 表单可以提交之后,又出现了新的问题.由于基于dz开发,表单提交之后使用submitcheck()这个函数来检查表单是否提交,由jquery提交上来的表单始终无法验证通过.最后采用模拟点击提交按钮的方法来实现. 复制代码 代码如下: <!-- lang: js --> $('input#asubm

  • JS定义网页表单提交（submit）的方法

    本文实例讲述了JS定义网页表单提交(submit)的方法.分享给大家供大家参考.具体如下: 这段代码表示网页表单提交时不是提交到指定的页面,而是执行一个特定的函数 <script> function saveInfo() { localStorage.setItem("name",$("#name").val()); } </script> <form id=register onSubmit="return saveInfo

  • js创建表单元素并使用submit进行提交

    js 创建form.input元素,并设置form的action及method,最后使用submit进行提交 <script src="Scripts/jquery-1.7.1.js"></script> <script type="text/javascript"> function SubmitFormToSF() { var sfForm = document.createElement("form");

  • 表单元素的submit()方法和onsubmit事件应用概述

    表单元素拥有submit方法,同时也具有onsubmit事件句柄,用于监听表单提交.可以使用elemForm.submit();方法触发表单提交.1.表单元素中出现了name="submit"的元素这种情况下elemForm.submit();将不会触发表单提交,因为表单原始的submit方法将会被覆盖(formElem.submit就是对该元素的引用).2.elemForm.submit();不会触发表单的onsubmit事件没有为什么,标准中就是这么规定的.与此有些类似的是onfo

  • Ajax中通过JS代码自动获取表单元素值的示例代码

    我们在使用Ajax的时候,通常需要获取表单元素值,然后发送给后台的服务器端程序处理.如果表单元素不多的情况我们常常会通过GET方式来获取表单元素值,但如果表单元素非常多,此时就需要用POST方式来获取表单元素值,那么如何来获取表单元素值呢?下面给出一段JS代码即可自动获取表单元素的值了. function getFormQueryString(frmID) //frmID是表单的ID号,请在表单form中先命名一个ID号 { var frmID=document.getElementById(f

  • 表单元素值获取方式js及java方式的简单实例

    大家都知道我们在提交form的时候用了多种input表单.可是不是每一种input表单都是很简单的用Document.getElementById的方式就可以获取到的.有一些组合的form类似于checkbox或者radio或者select我们如何用javascript获取和在服务器中获取提交过来的参数呢? 多说无用.上代码: Jsp-html代码:  <form action="input.do" name="formkk"> <table>

  • JS document form表单元素操作完整示例

    JS document form表单元素操作完整示例

    本文实例讲述了JS document form表单元素操作.分享给大家供大家参考,具体如下: <html> <head> <title>form表单操作</title> <meta charset="UTF-8"/> <script type="text/javascript"> function testForm(){ // 获取form对象 方法一,通过id,比较普遍的方法 var fm=d

  • js表单元素checked、radio被选中的几种方法(详解)

    0.环境 <input type="checkbox"  value="lol"/>lol var lol = document.getElementsByTagName("input")[0]; 1.HTML DOM a.lol.checked = true; 属性的值可以不是lol,只要转为布尔值的时候为true就可以,取值时只有true.false两种 不会增加checked标记 b.lol.click(); 不会增加check

  • vue.js使用v-model实现表单元素(input) 双向数据绑定功能示例

    vue.js使用v-model实现表单元素(input) 双向数据绑定功能示例

    本文实例讲述了vue.js使用v-model实现表单元素(input) 双向数据绑定功能.分享给大家供大家参考,具体如下: v-model 一般表单元素(input) 双向数据绑定 el:'#box',//这里放的是选择器. 不然会不生效 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>www.jb51.net vu

  • 详解Bootstrap创建表单的三种格式（一）

    详解Bootstrap创建表单的三种格式（一）

    在本章中,我们将学习如何使用 Bootstrap 创建表单.Bootstrap 通过一些简单的 HTML 标签和扩展的类即可创建出不同样式的表单.  Bootstrap表单类型分为三种格式:垂直或基本表单.内联表单.水平表单. 垂直或基本表单(display:block;) 基本的表单结构是 Bootstrap 自带的,个别的表单控件自动接收一些全局样式.下面列出了创建基本表单的步骤: 向父 <form> 元素添加 role="form". 把标签和控件放在一个带有 cla

  • Bootstrap如何创建表单

    Bootstrap如何创建表单

    Bootstrap表单类型分为三种格式:垂直或基本表单.内联表单.水平表单. 垂直或基本表单(display:block;) 基本的表单结构是 Bootstrap 自带的,个别的表单控件自动接收一些全局样式.下面列出了创建基本表单的步骤: 向父 <form> 元素添加 role="form". 把标签和控件放在一个带有 class .form-group 的 <div> 中.这是获取最佳间距所必需的. 向所有的文本元素 <input>.<tex

  • 原生js 实现表单验证功能

    原生js 实现表单验证功能

    表单验证是web前端最常见的功能之一,也属于前端开发的基本功.自己完成一个表单验证的开发,也有助于加深对字符串处理和正则表达式的理解. 基本的表单验证包括如:字母验证.数字验证.字母和数字验证.汉字验证.密码验证.日期验证.手机验证.邮箱验证,密码验证等. 现在就来完成这些验证代码的编写,先来看字母是怎么验证的.先编写需要的html代码,创建一个id为formContainer的表单元素,在里面加入需要验证英文字母的文本框和按钮,文本框后面需要一个span元素存放提示文字.如下所示: <form

随机推荐