关于 form表单 嵌套问题的解决方案
我们经常是这样嵌套的:
<form id="formId1" action="" method="post"> //表单1
<form id="formId2" action="" method="get"> //表单2
<input id="but1" type="button" value="提交">
</form>
<input id="but2" type="button" value="保存">
</form>
然后,我们会发现我们表单2执行submit提交时会报错找不到submit(),
我们执行console.log(document.getElementById('formId2'));会发现结果为null;
既然我们发现form表单可并存但是不能嵌套了,那么怎样去解决呢?
<form id="formId1" action="" method="post">
<input id="but1" type="button" value="提交">
<input id="but2" type="button" value="保存">
</form>
上临代码:我们把多个表单执行的事件放在一个表单里面,但提交的时候我们加以控制:
document.getElementById('but1').onclick=function(){
document.getElementById('formId1').setAttribute("action","www.baidu.com");
}
document.getElementById('but2').onclick=function(){
document.getElementById('formId1').removeAttribute("action","www.baidu.com")
document.getElementById('formId1').setAttribute("action","www.google.com");
}
这样通过上传/请求时,Action的变换,可以解决。
关于 form表单 嵌套问题的解决方案的更多相关文章
- form表单嵌套,用标签的form属性来解决表单嵌套的问题
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 关于form表单排版的技巧
//此处说明一个对于排版表单的方法将form表单嵌套在table里,因为table是格式化的,所以就不用再手动排版了源码如下 <from action="" method=& ...
- 直接提交一个form表单后台返回一个新页面通过target属性可以放到iframe当中
问题描述: 我想提交一个form表单后台直接返回一个新页面,但是当前页面还不想被替换掉: 解决方案: 在页面中添加一个iframe将form表单的target属性设置为iframe的id这样的话返回的 ...
- Javascript中的Form表单知识点总结
Javascript中的Form表单知识点总结 在HTML中,表单是由form元素来表示的,但是在javascript中,表单则由HTMLFormElement类型,此元素继承了HTMLElement ...
- Element Form表单实践(上)
作者:小土豆biubiubiu 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.im/user/58c61b4361ff4b005d9e8 ...
- 数据表格,查询、导出共用一个form表单,实现文件流方式下载
在开发中遇到问题是这样的: 在维护老的管理系统的过程中,老板说让加导出功能:项目中,查询的筛选条件是用的表单提交的方式写的. 解决方案有两种: 一.用ajax方式导出 var array = $('# ...
- JSP表单提交中文乱码解决方案
分2种提交方式,解决方案不同: 1.form表单提交方式为get 乱码: 解决方案: 因为get方法是参数在URL中显示,因为tomcat的URL编码默认是:IOS-8859-1所以要么改tomcat ...
- form表单那点事儿(上) 基础篇
form表单那点事儿(上) 基础篇 做为html中最为常见,应用最广泛的标签之一,form常伴随前端左右.了解更深,用的更顺. 目录: 表单属性 表单元素 常识 模拟外观 表单属性 这个表单展示了fo ...
- [原创]java WEB学习笔记62:Struts2学习之路--表单标签:form,表单标签的属性,textfield, password, hidden,submit ,textarea ,checkbox ,list, listKey 和 listValue 属性,select ,optiongroup ,checkboxlist
本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...
随机推荐
- Docker学习笔记 - Docker的简介
传统硬件虚拟化:虚拟硬件,事先分配资源,在虚拟的硬件上安装操作系统,虚拟机启动起来以后资源就会被完全占用. 操作系统虚拟化:docker是操作系统虚拟化,借助操作系统内核特性(命名空间.cgroups ...
- OAuth2.0学习(1-3)OAuth2.0的参与者和流程
OAuth(开放授权)是一个开放标准.允许第三方网站在用户授权的前提下访问在用户在服务商那里存储的各种信息.而这种授权无需将用户提供用户名和密码提供给该第三方网站. OAuth允许用户提供一个令牌给第 ...
- Java设计模式(八)Proxy代理模式
一.场景描述 代理在生活中并不少见,租房子需要找中介,打官司需要找律师,很多事情我们需要找专业人士代理我们做,另一方面,中介和律师也代理了房东.法律程序与我们打交道. 当然,设计模式中的代理与广义的代 ...
- highstaock+websocket实现动态展现
效果:从后台获取回测数据,在前端动态展现,和聚宽实现的回测效果相仿 大体思路:先传一个[[int,0],[int,0],[int,0],[int,0],[int,0],...]格式的死数据到前端渲染x ...
- C#使用Socket实现一个socket服务器与多个socket客户端通信
在分布式调度系统中,如果要实现调度服务器与多台计算节点服务器之间通信,采用socket来实现是一种实现方式,当然我们也可以通过数据存储任务,子节点来完成任务,但是往往使用数据作为任务存储都需要定制开发 ...
- nginx 官方文档翻译
nginx(发音为"engine x")是一个由俄罗斯软件工程师Igor Sysoev编写的免费开源Web服务器.自2004年公开发布以来,nginx专注于高性能,高并发性和低内存 ...
- disabled OR readonly
1.对元素设置disabled以及readonly属性 $("#uid").attr("disabled",true); $("#uid") ...
- jQuery系列 第二章 jQuery框架使用准备
第二章 jQuery框架使用准备 2.1 jQuery框架和JavaScript加载模式对比 jQuery框架的加载模式 <script> window.onload = function ...
- java中的引用传递问题
---恢复内容开始--- 第一个引用传递案例: class Message{ private int num; public Message(int num){ this.num=num; } pub ...
- 0323-DOM基础操作
dom操作 1.找到元素(标签对象) 标签名: document.getElementsByTagName()[]; //返回的是数组类型,需要有下标来找内容 属性: document.getElem ...