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

Jsp-html代码:

复制代码
代码如下:
 <form action="input.do"
name="formkk">
   <table>
    <tbody>
     <tr>

<td>text:</td>
      <td>
       <input
type="text"
name="text">
      </td>
     </tr>
     <tr>

<td>password:</td>
      <td>
       <input
type="password"
name="pass">
      </td>
     </tr>
     <tr>

<td>radio:</td>
      <td>
       <input
type="radio" name="xingbie" value="1">
       男
       <input
type="radio" name="xingbie"
value="2">
       女
      </td>
     </tr>
     <tr>
      <td>checkbox:</td>
      <td>
       足球:<input
type="checkbox" name="hobby" value="1"  />
       篮球:<input
type="checkbox" name="hobby" value="2"  />
       拍球:<input
type="checkbox" name="hobby" value="3"  />
       斗球:<input
type="checkbox" name="hobby" value="4" 
/>
      </td>
     </tr>
     <tr>
      <td>hidden:</td>
      <td>
       <input
type="hidden" value="123"
name="hidden"/>
      </td>
     </tr>
     <tr>
      <td>option:</td>
      <td>
       <select
name="opt"
id="opt">
       <option>1</option>
       <option>2</option>
       <option>3</option>
       <option>4</option>
       </select>

</td>
    </tbody>
   </table>
   <input
type="button" value="提交"
onclick="javascript:check()"/>
  </form>

Javascript:

复制代码
代码如下:
function check(){

var radio =
document.getElementsByName("xingbie");
   var checkbox =
document.getElementsByName("hobby");
   var select =
document.getElementById("opt");

//获取select标签
   var index =
select.selectedIndex;
   var text = select.options[index].text;
   var
value = select.options[index].value;

//获取radio标签
   for(var
i=0;i<xingbie.length;i++){
    if(xingbie.item(i).checked){
     var
val =
xingbie.item(i).getAttribute("value");
     break;
    }
    continue;
   }
   //获取checkbox标签
   for(var
i=0;i<hobbys.length;i++){
    if(hobbys[i].checked){
     alert(hobbys[i].value);
    }
    continue;
   }

//提交form表单
   document.formkk.submit();

}

Java:

复制代码
代码如下:
 String[] hobbys =
request.getParameterValues("hobby");  //checkbox
 String text =
request.getParameter("text");    //text
 String password =
request.getParameter("password"); //password
 String xingbie =
request.getParameter("xingbie");  //radio
 request.getParameter("hidden");
 request.getParameter("opt");   
//select

Javascript和Java获取各种form表单信息的简单实例的更多相关文章

  1. java:JavaScript2:(setTimeout定时器,history.go()前进/后退,navigator.userAgent判断浏览器,location.href,五种方法获取标签属性,setAttribute,innerHTML,三种方法获取form表单信息,JS表单验证,DOM对象,form表单操作)

    1.open,setTimeout,setInterval,clearInterval,clearTimeout <!DOCTYPE> <html> <head> ...

  2. Django获取用户form表单

    首先创建一个Django 的工程项目 前面我们说过了,那到一个项目首先把模板路径,和静态路径在settings.py设置好以后,在开始写代码,写代码也要按照我们以前说的那个工程目录结构写. 现在我们做 ...

  3. Java如何实现form表单提交的数据自动对应实体类(源码)

    原文出自:https://blog.csdn.net/seesun2012 原生Java+JQuery form表单serializeArray提交自动对应java实体,这是一个实际的例子: html ...

  4. Django框架获取各种form表单数据

    Django中获取text,password 名字:<input type="text" name="name"><br><br& ...

  5. django Form 表单 总结与小实例

    开头寄语: 这几天一直在看Django的form表单验证,然后想对于这几天要有个总结. 首先,先来看一下找到的一个form表单验证的流程: 验证过程 流程详解1. 函数full_clean()依次调用 ...

  6. mvc area区域和异步表单,bootstrap简单实例

    码农最怕眼高手低 今天来练习mvc Area技术和bootstrap以及异步表单的C#代码实现. 1.area区域架构对于建立复杂业务逻辑很有帮助,由  AreaRegistration.Regist ...

  7. java web 解决Form表单乱码问题

    JSP和Servlet的六种中文乱码处理方法 一.表单提交时出现乱码: 在进行表单提交的时候,经常提交一些中文,自然就避免不了出现中文乱码的情况,对于表单来说有两种提交方式:get和post提交方式. ...

  8. JAVA入门[16]-form表单,上传文件

    一.如何传递参数 使用 @RequestParam 可以传递查询参数.例如:http://localhost:8092/category/detail?id=1 @RequestMapping(&qu ...

  9. Java如何解决form表单上传文件,以及页面返回处理结果通知!

    前端JSP代码 <form id='formSumbit' class='form-horizontal' action='/ncpay/route/chlsubmcht/batchImpor' ...

随机推荐

  1. tomcat中配置jmx监控

    1.在tomcat的start.bat中添加下面代码, -Dcom.sun.management.jmxremote.ssl=false -Dcom.sun.management.jmxremote. ...

  2. h5上传图片

    1.如何在H5上传图片 使用FileReader 2.FileReader接口 传图片我们只用到readAsDataURL 3.FileReader接口事件 传图片我们只用到onload 4.如何使用 ...

  3. Laravel5.1-Eloquent ORM:起步

    概述 有很多朋友问,MCV的M是在哪里介绍的,这里就是介绍M的地方了.Laravel有一个强大的数据库ORM Eloquent,它的原理是每张数据表对应一个Model,对Model的操作就对应数据库的 ...

  4. Mysql字段操作—增加字段、删除字段、修改字段名、修改字段类型(约束条件)

    1.增加字段:    alter table   tablename    add   new_field_id   type   not null default '0';     例:     a ...

  5. linux中comm命令用法

    linux系统中comm命令用法详解 linux系统下的comm命令是一个非常实用的文件对比命令. comm命令功能:   选择或拒绝两个已排序的文件的公共的行. comm命令语法:comm [-12 ...

  6. Android沉浸式任务栏的实现

    1.MainActivity.java public class MainActivity extends Activity { @Override protected void onCreate(B ...

  7. Spring结合Quartz实现多任务定时调用(转载)

    Quartz框架提供了丰富的任务调度支持,比如,在 何时执行何种任务,它是一个开源的由OpenSymphony维护的项目,开发者能够在Java EE,或单独的Java SE应用中使用它.无论是简单的任 ...

  8. apache poi 生成excel

    ExcelBuilder.Java package com.coracle.yk.xmanager.util.poi; import com.coracle.yk.xframework.util.Bl ...

  9. 【Networking】容器网络大观 && SDN 资料汇总

    SDNLAB技术分享(十五):容器网络大观   SDNLAB君• 16-06-17 •2957 人围观 编者按:本文系SDNLAB技术分享系列,本次分享来自SDN撕X群(群主:大猫猫)群直播,我们希望 ...

  10. [转]Java 征途:行者的地图

    前段时间应因缘梳理了下自己的 Java 知识体系, 成文一篇望能帮到即将走进或正在 Java 世界跋涉的程序员们. 第一张,基础图 大约在 2003 年我开始知道 Java 的(当时还在用 Delph ...