表单及其控件的访问

行吟阁 2020-06-26

表单及其控件(元素)的访问方式

1.采用表单名称.控件名称.属性

  表单名称.控件名称.方法(参数)

2.采用forms[下标].elements[下标/元素id名称/元素name名称].属性，elements表示表单里面的所有元素的数组

   forms[下标].elements[下标/元素id名称/元素name名称].方法(参数)

 3.访问select下拉列表option元素的方法

  select的id名称.options[下标].属性

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body><!--placeholder是html5的新属性，需要注意兼容性-->
        <form id="dd" name="calc">
            <input type="text" name="tx1"  placeholder="请在这里输入信息" value="111" />+
            <input type="text" name="tx2" value="222" readonly/>
            =<span id="d2"></span>
            <input type="button"  onclick="cal()" value="计算" />
             
            
        </form>
        <script>
           function cal()
            {
//documnet表示页面上的所有对象元素，在通过表单的id名或者name去引用想要的属性值
//通过document.表单id名称calc.元素的id名称tx1.属性
var t1=document.calc.tx1.value;
//通过documnet.forms[下标].elements[下标].属性;
var t2=document.forms[0].elements[1].value;
document.getElementById("d2").innerHTML=parseFloat(t1)+parseFloat(t2); } </script> </body> </html>

 代码效果图如下

表单及其控件的访问

行吟阁

行吟阁

相关推荐

使用AJAX实现UTF8编码表单提交到GBK编码脚本无乱码的解决方法

<li><a href="utf8Form.html" rel="external nofollow" rel="external nofollow" rel="ext

learningever / 0评论 2020-09-19

HTML表单

Action ：规定提交表单时，向何处发送数据Method ：规定提交表单所使用的HTTP方法。　　GET 最适合少量数据的提交。浏览器会设定容量限制。目前只有 Safari 8 支持 tel 类型　　URL ：用于应该包含 URL 地址的输入字段。

nercon / 0评论 2020-07-26

Javaweb使用getPart来接收表单文件

使用getPart接收表单文件时，注意Tomcat版本要在8之上。photo.lastIndexOf(‘.‘)的返回值为"."的位置，加1表示后缀名的起始位置。String path = "E:\\testPic";

运维工程师日记 / 0评论 2020-07-19

WEB前端第五课——HTML表单

　　iframe为内联框架，iframe元素是可以创建包含另外一个文档的行内框架，是body的子集。<iframe src="" name="topframe" frameborder="0"

haohong / 0评论 2020-07-18

06.vue-charp-06 表单与v-model

何使用指令v-model完成表单的数据双向绑定。<input type="text" v-model="name" placeholder="你的名字" />. <h1>v

dadaooxx / 0评论 2020-07-04

PHP Web表单生成器案例分析

本文实例讲述了PHP Web表单生成器。分享给大家供大家参考，具体如下：。在项目的实际开发中，经常需要设计各种各样表单。直接编写HTML表单虽然简单，但修改、维护相对麻烦。因此，可以利用PHP实现一个Web表单生成器，使其可以根据具体的需求定制不同功能的表

dadaooxx / 0评论 2020-06-13

212、表单属性

在使用包含文件上传控件的表单时，必须使用该值。3、想要构造一个包含Form表单数据的FormData对象，需要在创建FormData对象时指定表单的元素。

qsdnet我想学编程 / 0评论 2020-06-09

FormData

formdata对象不能用于get请求，因为formdata的数据要放到send()方法中，而get请求方式的请求参数只能放在请求地址的后面。表单中的input控件必须要有name属性，因为当我们把表单提交到服务器的时候，表单的name属性会作为请求参数的

pythonclass / 0评论 2020-06-07

00022-layui 显示表单，iframe父子页面传值

<div class="layui-form" lay-filter="orderPayForm" id="orderPayForm" style="padding: 20px 1

pythonclass / 0评论 2020-06-04

Spring mvc页面表单提交获取数据后台接收参数实现

<%@ page language="java" contentType="text/html; charset=utf-8". <!<meta http-equiv="Content-T

lyg0 / 0评论 2020-06-04

00022-layui 显示表单，iframe父子页面传值

<div class="layui-form" lay-filter="orderPayForm" id="orderPayForm" style="padding: 20px 1

WebVincent / 0评论 2020-06-03

input表单如何制作多行文本输入框？一篇文章教你学会使用input标签

本篇文章主要的为大家讲述了HTMLinput标签如何制作一个登陆界面的介绍，有文本框、密码框、单选框、多选框、提交和重置按钮的使用说明，完全的解释了HTML表单input标签的使用详情了。现在让我们来看看这篇文章吧。<form action=&quo

niehanmin / 0评论 2020-05-28

vue表单示例

<!DOCTYPEhtml>. <metaname="viewport"content="width=device-width,initial-scale=1.0">. 姓名:<text

pythonclass / 0评论 2020-05-09

雷林鹏分享：jsp 表单处理

　　我们在浏览网页的时候，经常需要向服务器提交信息，并让后台程序处理。浏览器中使用 GET 和 POST 方法向服务器提交数据。　　用get时，传输数据的大小有限制 ，最大为1024字节。　　JSP使用getParameter()来获得传递的参数，getI

gufudhn / 0评论 2020-04-30

html表单标签

for属性的值与<input>标签的id属性的值一致时，点击<label>标签标注的文字可以激活输入框。value属性 定义表单元素的值，此值是不能输入内容类型的标签提交数据时的值。<input type="radi

行吟阁 / 0评论 2020-04-18

layui的form表单一行显示多个文本框

相当于用<div class="layui-inline">包括两个表单项。

lyg0 / 0评论 2020-04-10

0基础学习前段历程2 第一门需要掌握的前端技术HTML5+CSS3 html表单类

<!--表单类-->. <label>姓名</label>. <inputtype="text">文本框。<inputtype="password">密码框

swiftwwj / 0评论 2020-03-08

forms表单与modelfrom使用

在页面上对数据进行操作时，如果不用forms组件，在设计HTML页面时，会有冗长的代码，特别是修改数据页面，视图中处理数据也同样不方便：

nercon / 0评论 2020-03-03

HTML表单提交标签

name 属性用于对提交到服务器后的表单数据进行标识，或者在客户端通过 JavaScript 引用表单数据。设置name后URL编码才能转换成人能看的懂的数据

玫瑰小妖 / 0评论 2020-02-24

HTML表单标签

maxlength：控制最多输入的字符数，legend元素必须是fieldset内的唯一个元素。分割URL和传输数据，参数之间以&相连。. 从请求的大小看，GET请求的长度受限于浏览器或服务器对URL长度的限制，允许发送的数据量比较小，而POST请

行吟阁 / 0评论 2020-02-23

1.9、html表单

表单用于搜集不同类型的用户输入，表单由不同类型的标签组成，实现一个特定功能的表单区域，首先应该用<form>标签来定义表单区域整体，在此标签中再使用不同的表单控件来实现不同类型的信息输入，具体实现及注释可参照以下伪代码：。method属性定义提

pythonclass / 0评论 2020-02-03

表单绑定的基本用法

下面的代码实现的有：单行文本、多行文本、复选框、单选按钮、选择框。-- 多个复选框，绑定到同一个数组 -->. 多选时的选择框是不是有问题？

黎豆子 / 0评论 2020-02-02

Laravel5.1 框架表单验证操作实例详解

本文实例讲述了Laravel5.1 框架表单验证操作。分享给大家供大家参考，具体如下：。当我们提交表单时 通常会对提交过来的数据进行一些验证、Laravel在Controller类中使用了一个traint：ValidatesRequest。方便我们在控制器

WangJiangNan / 0评论 2020-01-07

JavaScript在表单页面添加打印功能，打印表单中的值并打印完成后不刷新页面

在一个页面上，有一个表单，表单包括textbox, radiobutton, checkbox, textarea等控件。最简单的想法就是，加上一个print的链接，然后调用javascript中的window.print()能打印。<a href=

sunlizhen / 0评论 2020-01-10

表单事件

<!DOCTYPE html>. <html lang="en">. <head>. <meta charset="UTF-8">. <title>表单事件

nercon / 0评论 2019-12-28

JavaEE项目中的utf-8编码

同时，浏览器也是根据这个参数来对其接收到的数据进行重新编码。所以对于POST表单提交的数据，在获得数据的JSP页面中request.setCharacterEncoding要和生成提交该表单的JSP页面的 response.setCharacterEnco

GATSBYER / 0评论 2014-07-13

HTML基础——表单的应用

一个完整的表单由表单控件、提示信息和表单域3个部分构成。<form></form>标记被用于定义表单域，即创建一个表单。⑤.novalidate属性：指定在提交表单时取消对表单进行有效的检查。

爱好HtmlCssJs / 0评论 2019-12-13

(尚012)Vue表单数据的自动手集(表单数据提交,需要收集表单数据)

DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title<

Norsaa / 0评论 2019-12-11

javaScript测试代码

--//获取表单对象的3种方式-->. --//3.document.form["表单的name的value值"]-->. //返回表单中所有的表单域对象的一个数组。// 常见标签适用直接获取和修改！!--/3.表单

HSdiana / 0评论 2019-11-10

HTML5 表单属性

HTML5 的 <form> 和 <input>标签添加了几个新属性.autocomplete 属性规定 form 或 input 域应该拥有自动完成功能。当用户在自动完成域中开始输入时，浏览器应该在该域中显示填写的选项。autof

pythonclass / 0评论 2019-11-07

自定义表单、流程、菜单开发总结

最近在做自定义表单、自定义流程、自定义菜单，由于某些原因，现在这个项目正处于停滞状态。但核心功能已实现，做点总结拿出来分享。该功能集成于一款即时通迅办公软件。下载后在一个类似于QQ应用中心的面板中点击使用事务流即可打开此应用。在编码中首先解决的是如何将组件

zhangli / 0评论 2014-06-24

html表单示例

<!

玫瑰小妖 / 0评论 2019-11-04

python框架-django中的表单类

def form_test_view:　　 # 如果是post请求，将数据绑定到表单，直接存储在request.POST中，取值普通表单一样。# 检验数据的有效性　　　　　　　# 验证过的数据可以通过 form.cleaned_data取得，格式是一个字典

typhoonpython / 0评论 2019-11-03

JavaScript使用表单元素验证表单

网站最基础的就是注册,它是一个系统的交互基础.因为用户最后要去点击"注册"按钮,所以我们就在"注册"按钮上添加一个onclick事件属性,引用eg.regCheck(). eg.regCheck()函数需要添加的行为

renpinghao / 0评论 2019-11-03

vue3.0 CLI - 2.4 - 新组件 Forms.vue 中学习表单

我的 github 地址 - vue3.0Study - 阶段学习成果都会建立分支。这样就建立新的路由，这块我建立了新的 git commit。注意：组件名称尽量满足以下要求：1、勿采用 HTML 标签名；2、勿采用 vue 内部保留的名称如 slot 、

fengent / 0评论 2018-09-14

HTML的简单介绍（32）

action 属性定义在提交表单时执行的动作。向服务器提交表单的通常做法是使用提交按钮。Method 属性method 属性规定在提交表单时所用的 HTTP 方法：”<”form action="action_page.php"

玫瑰小妖 / 0评论 2019-10-29

HTML的简单介绍（30）

“<”form> 元素HTML 表单用于收集用户输入。表单元素指的是不同类型的 input 元素、复选框、单选按钮、提交按钮等等。“<”input> 元素有很多形态，根据不同的 type 属性。

爱好HtmlCssJs / 0评论 2019-10-28

前端从头再出发之表单

<input type="text" value="value指定默认值" id="account">. <input type="text" placeho

HSdiana / 0评论 2019-10-24

7 frame表单切换、多窗口切换

说明：在WebDriver中封装了获取当前窗口句柄方法和获取所有窗口句柄的方法以及切换指定句柄窗口的方法；

爱好HtmlCssJs / 0评论 2019-10-23

xss学习

HTML 表单用于收集不同类型的用户输入。表单是一个包含表单元素的区域。表单元素 是允许用户在表单中输入内容,比如：文本域、下拉列表、单选框、复选框等等。关闭Chrome xss-auditor防护 :新建快捷方式，然后把Chrome的安装路径黏贴到“请键

csxiaoqiang / 0评论 2019-10-21

使用jquery-mobile提交表单出现的问题

http服务端是用Spring MVC实现，浏览器端的页面用了jquery-mobile，功能是一个简单的form提交。结果浏览器端的form点提交按钮submit后地址栏还是停留在post的url，重定向失败，查看html源代码，则显示。HTTP Sta

xuanbai / 0评论 2015-04-11

无废话ExtJs 教程四[表单：FormPanel]

继上一节内容，我们在窗体里加了个表单。如下所示代码区items:form。说明1：var form = new Ext.form.FormPanel({}):创建一个新的form表单对象。style: 'margin:10px':表单的样式，加了个外10p

纯屌丝程序猿 / 0评论 2015-05-26

JQ 表单验证

//如果是必填的，则加红星标识.var $required = $; //创建元素。var errorMsg = '请输入至少6位的用户名.';var okMsg = '输入正确.';//提交，最终验证。

谷歌架构师 / 0评论 2016-04-15

防止表单重复提交

针对"在网络延迟的情况下让用户有时间点击多次submit按钮导致表单重复提交"这个应用场景，使用JavaScript是可以解决这个问题的，解决的做法就是"用JavaScript控制Form表单只能提交一次"。　　在下

wenhuadream / 0评论 2016-04-19

poshytip漂亮的表单提示插件

一款很实用的小插件，在表单的输入框会显示提示信息，你可能会用的它。<p>1、<a id="tips" title="我是不是很漂亮啊！~" href="#">滑动这里有惊喜

hong / 0评论 2017-02-24

HTML表单之input元素的23种type类型

　随着HTML5的出现，input元素新增了多种类型，用以接受各种类型的用户输入。其中，button、checkbox、file、hidden、image、password、radio、reset、submit、text这10个是传统的输入控件，新增的有c

谷歌架构师 / 0评论 2017-12-27

关于html表单元素的readonly和disabled属性

readonly属性规定输入字段为只读。不过，用户仍然可以使用tab键切换到该字段，还可以选中或拷贝其文本。readonly只对text、password以及textarea有效。将其设置在select、radio、checkbox等表单元素上不会起效果，

PioneerFan / 0评论 2018-01-13

解决layui的使用以及针对select、radio等表单组件不显示的问题

layui是国内一款界面比较整洁大方的ui框架，里面封装了很多前端开发常用的组件，通常我们直接复制代码过去就可以实现效果，可以提高我们的开发效率。<script type="text/javascript" src="/

二毛妮子 / 0评论 2019-09-05

表单介绍

两者的不同将在后台处理中进行解释。label标签：用来辅助文本输入框，在点击label时可以直接进入文本框。password：密码框，输入的内容均以点显示。只有name相同的checkbox才算是一组信息。通过value来修改按钮的显示文字。placeho

zZoOoOJaVa / 0评论 2018-02-19