何谓表单？

    表单是html页面中负责数据采集功能的部件，它往往由三个部分组成：

        表单标签：<form></form> 用于声明表单的范围，位于表单标签中的元素将被提交。属性有method，entype，action等

        表单域：<input...../>包含了 包含了文本框，密码框等多种类，属性有type，name, value...

                    type=text 文本框

                    type=password 密码框

                    type=textarea文本区域

                    type=file文件上传框

                    type=radid单选框

                    type=checkbox复选框

        表单按钮

                提交按钮

                复位按钮

                一般按钮 

    我们可以通过表单，将用户输入的数据提交给服务端，并交由服务端进行处理。

例子：

<html>

    <head>

        <title>form表单</title>

        <meta charset="utf-8">

        <script type="text/javascript" src="getValue.js"></script>

    </head>

        <body>

            <form name="form1">

                <!--文本-->

                <input type="text" placeholder="text" name="text1" />

                <!--密码-->

                <input type="password" placeholder="password" name="password" />

                <!--多行文本域-->

                <textarea placeholder="textarea" name="textarea" style="resize:none"></textarea>

                <!--文件上传-->

                <input type="file" name="file"/>

                <!--单选框,注意name值一样-->

                <input type="radio" name="option" value="option1"/>option1

                <input type="radio" name="option" value="option1"/>option2

                <!--复选框-->

                <input type="checkbox" name="check" value="option1"/>option1

                <input type="checkbox" name="check" value="option2"/>option2

                <input type="checkbox" name="check" value="option3"/>option3

                <input type="submit" value="submit"/>

                <input type="reset" value="reset"/>

                <input type="button" value="button" onclick="getValue()"/>

            </form>

        </body>

</html>

javascrpt获取表单的值

function getValue(){

    var v1 = document.form1.text1.value;

    var arr = document.form1.check;

    alert(arr[0].value)

}

javascript获取表单的各项值的更多相关文章

  1. jquery的attr获取表单checked 布尔值问题

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 获取表单的初始值，模拟placeholder属性

    input和textarea有一个默认属性defaultValue,即初始值. 即使在页面操作修改了input和textarea的内容,获取到的defaultValue依然是初始值.可通过该值模拟pl ...

  3. ionic获取表单input的值的两种方法

    1.参数传递法 直接在input处使用 #定义参数的name值,注意在ts中参数的类型 html页面: <ion-input type="text" placeholder= ...

  4. 使用js获取表单元素的值

    function getParams(formName) { var frmMain = document.getElementById(formName)?document.getElementBy ...

  5. JavaScript之控制表单元素的值

    表单元素.value 获取表单元素的值 表单元素.value='这是修改后的值' 修改表单元素的值 案例: (1)html <input type="text" id=&qu ...

  6. JS获取表单元素的value

    <!-- 1.option selected属性,如果我们在下拉列表里面选择了一个option那么他的selected="true" ,如果我们想设置当前的option是选中 ...

  7. 用jQuery获取表单的值

    在日常开发过程中,有许多用到表单的地方.比如登录,注册,比如支付,填写订单,比如后台管理等等. 使用jQuery来获取表单的值是比较常见的做法. 常见表单 单行文字域:<input type=' ...

  8. jQuery 获取、设置表单元素的值

    获取表单元素值: 文本框,文本区域: $("#txt").attr("value"): 多选框 checkbox:$("#checkbox_id&qu ...

  9. javaWeb中怎么获取提交表单里面的值

    在javaWeb中如何获得html文件中的表单里面的值? <!DOCTYPE html> <html> <head> <meta charset=" ...

随机推荐

  1. [SDOI2010] 魔法猪学院

    Description 给定e和边权,求有多少条不同的道路能从1到n使得边权之和的和小于e Solution A*裸题 娘的要是SPFA再把dis写成to就剁手 // By YoungNeal #in ...

  2. vue技术解析二之组件通信

    --------------------------动画效果----------------------------------- <transition name="router-f ...

  3. express+mongodb+socket.io

    node后端代码 // Setup basic express server var express = require('express'); var app = express(); var pa ...

  4. poj-1056-IMMEDIATE DECODABILITY（字典）

    Description An encoding of a set of symbols is said to be immediately decodable if no code for one s ...

  5. Algorithm --> 投资组和求最大利润

    投资组和求最大利润 题目: 投资人出资一笔费用mount,投资给不同的公司(A,B,C....),求最大获取利润? 例如:投资400百万,给出两家公司A和B: 1.如果投资一百万给A公司,投资3百万给 ...

  6. UWP 拖拽文件

    桌面环境下的UWP,加入拖拽模式还是会增加用户好感度的. 好了,先看一下我最新研发的[小微识别]吧,演示一下 炫酷,有没有,

  7. DevOps实践之Jenkins安装部署

    Prerequisites Minimum hardware requirements: 256 MB of RAM 1 GB of drive space (although 10 GB is a ...

  8. String s=new String("abc")创建了几个对象?

    String str=new String("abc");   紧接着这段代码之后的往往是这个问题,那就是这行代码究竟创建了几个String对象呢? 答案应该是1个或者2个. 1个 ...

  9. Beta冲刺链接总汇

    Beta冲刺 咸鱼 Beta 冲刺day1 Beta 冲刺day2 Beta 冲刺day3 Beta 冲刺day4 Beta 冲刺day5 Beta 冲刺day6 Beta 冲刺day7 凡事预则立- ...

  10. C语言博客作业—数组

    一.PTA实验作业 题目1:简化的插入排序 1. 本题PTA提交列表 2. 设计思路 (1)定义n,number,i,j,temp; (2)输入n; (3)定义数组a[n+1]; //把所有的数都放入 ...