form表单嵌套，用标签的form属性来解决表单嵌套的问题
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>标签的form属性</title>
</head>
<body>
<form action="demo-form.php" id="form1">
First name: <input type="text" name="fname"><br>
<input type="submit" value="提交">
</form>
<p> "Last name" 字段没有在 form 表单之内，但它也是 form 表单的一部分。</p>
Last name: <input type="text" name="lname" form="form1">
<p><b>注意:</b> IE 不支持 form 属性</p>
</body>
</html>上面是对标签form属性的一个理解，下面来看一个问题
<form action="form.jsp" id="form1">
<input type="text" name="value1" />
<form action="12.jsp" id="form2">
<input type="text" name="value2" />
</form>
<input type="text" name="value3" />
<input type="submit" value="提交" onclick="submitForm();"/>
</form>
<script type="text/javascript">
function submitForm(){
document.getElementById("form1").submit();
}
</script> 如上代码，只能获取到value1和value2的值，value3的值将丢失。 因为form标签不能嵌套，嵌套后会导致第一个form后的数据都不能提交
下面来看用标签的form属性来解决这个问题，还是以问题代码为列。
<form action="form.jsp" id="form1">
<input form="form1" type="text" name="value1" />
<input form="form2" type="text" name="value2" />
<input form="form1" type="text" name="value3" />
<input type="submit" value="提交1" onclick="submitForm1();"/>
</form>
<form action="12.jsp" id="form2">
<input type="submit" value="提交2" onclick="submitForm1();"/>
</form>
<script type="text/javascript">
function submitForm1(){
document.getElementById("form1").submit();
}
function submitForm(){
document.getElementById2("form2").submit();
}
</script> 这样利用标签的form属性就可以不用改变表单的结构，就可以提交表单中的某一部分。
form表单嵌套，用标签的form属性来解决表单嵌套的问题的更多相关文章
- 话说Form标签的target属性-----无刷新表单提交
国庆前(2013)无聊,就在铁道部的12306上“逛”了下下. PS:原来之所以叫12306,是因为其客服号码是12306,好吧,我很无知…… 首先是被“逛”的页面:票价查询. 之所以去逛,是因为一直 ...
- dede让channelartlist标签支持currentstyle属性 完美解决
打开include\taglib\channelartlist.lib.php 找到 $pv->Fields['typeurl'] = GetOneTypeUrlA($typeids[$i]); ...
- 给标签设置disabled属性后提交不了数据
项目中遇到给select标签添加disabled属性然后提交表单的时候不能提交该表单的数据到后台, readonly属性对提交数据没有限制,但是readonly属性对radio.select.chec ...
- 1、前端--HTML简介、head内常见标签、body内常见标签（特殊符号、div、span、a、img、列表、表格table、表单form）、标签两大属性
今日内容 HTML简介 HTML是构造网页的骨架>>>:几乎所有的网站都是由HTML构建而成 HTML:超文本标记语言 # 不是一门编程语言 没有任何的逻辑 只有固定的标记功能 &q ...
- 表单相关标签之form标签
表单能够包含 input 元素,比如文本字段.复选框.单选框.提交按钮等等. 表单还可以包含 menus.textarea.fieldset.legend 和 label 元素以及其它块级元素 表单用 ...
- Form表单标签的Enctype属性的作用及应用示例介绍
Enctype :指定将数据回发到服务器时浏览器使用的编码类型.用于表单里有图片上传. 编码类型有以下三种: application/x-www-form-urlencoded: 在发送前编码所有字符 ...
- 禁止button标签提交form表单，变成普通按钮
button有个type属性,属性值可为button.submit.reset button=普通按钮,直接点击不会提交表单submit=提交按钮,点击后会提交表单reset=表单复位 当button ...
- form表单中的label标签
小伙伴们,你们在前面学习表单各种控件的时候,有没有发现一个标签--label,这一小节就来揭晓它的作用. label标签不会向用户呈现任何特殊效果,它的作用是为鼠标用户改进了可用性.如果你在 labe ...
- 在学习HTML——form表单中的label标签时的一点小体会
在我啃了一遍书本之后,开始了在慕课看视频的过程,从最开始的HTML+CSS的基础课程看起,在第5-9小节讲到了form表单的label标签, 首先看一下慕课的讲解: label 标签不会向用户呈现任 ...
随机推荐
- Modbus设备调试工具Winform（包括SRC0001、海康威视、TTS以及各种类型LED的测试）
1.SRC寄存器读写测试 2.采集数据终端模块(这里是康海时代)调试 3.RS485传感器设备调试 4.LED/TTS/海康威视等展示设备调试 5.Modbus等协议规约资料及4-20mA设备调试 以 ...
- ArcSDE：C#创建SDE要素数据集
转自原文 ArcSDE:C#创建SDE要素数据集 /// <summary> /// 判断指定数据集是否存在 /// </summary> /// <param name ...
- [Unit testing] data-test attr FTW
Most of time, we get used to use class name as a selector in the test. But one problem for this is c ...
- HBase高速导入数据--BulkLoad
Apache HBase是一个分布式的.面向列的开源数据库.它能够让我们随机的.实时的訪问大数据.可是如何有效的将数据导入到HBase呢?HBase有多种导入数据的方法.最直接的方法就是在MapRed ...
- 快速排序的期望复杂度O(nlogn)证明。
快速排序的最优时间复杂度是 \(O(nlogn)\),最差时间复杂度是 \(O(n^2)\),期望时间复杂度是 \(O(nlogn)\). 这里我们证明一下快排的期望时间复杂度. 设 \(T(n)\) ...
- 用Zebra打造Linux下小型路由器
用Zebra打造Linux下小型路由器 现在的Internet网络相当庞大,不可能在不同的网络之间建立直接的连接,所以这时就必须用路由器为不同网络之间的通信提供路径选择.Linux下搭建路由器价格非常 ...
- JavaScript 进度条重复加载
<!DOCTYPE HTML> <html> <head> <meta charset ="utf-8"> <title> ...
- BZOJ1444: [Jsoi2009]有趣的游戏（Trie图，矩乘）
Description Input 注意 是0<=P, n , l, m≤ 10. Output Sample Input input 1 3 2 2 1 2 1 2 AB BA AA inpu ...
- echarts统计图踩坑合集
1:折线图条的颜色修改 series : [ { name : 'SBP(收缩压)', type : 'line', itemStyle : { normal : { lineStyle:{ colo ...
- IntelliJ IDEA 2018 Community(社区版)创建J2EE项目+Tomcat9部署
博主打算开始系统地自学JAVA,首要问题就是解决IDE的问题, 以前用过像VS.Android Studio.Eclipse,知道Eclipse是JAVA最传统的IDE, 用过VS和AS的朋友都知道, ...