`
qn_lf
  • 浏览: 126131 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

js实现同时提交多个form ——基础巩固

阅读更多
<script language="javascript">
//点击提交按钮触发下面的函数
function submitit(){
//第一个表单
   var tform1= document.getElementById("formid1");
//第二个表单
   var tform2= document.getElementById("formid2");

 
//提交第一个表单
  tform1.submit();
//提交第二个表单
  tform2.submit();
   

}

</script>

 
<!--  第一个表单,方法为post,会触发后台的login.do对应的servlet ,提交到_hiddenframe1里了,即login.do返回的结果会隐藏在_hiddenframe1中-->
<form name="form1" id="formid1" action="login.do" method="post"  target="_hiddenframe1">
    <input type="text" name="tname" value="张三">
    <input type="button" name="tsub" value="提交" onClick="javascript:submitit();">
</form>

<!--  第二个表单,方法为post,会触发后台的sms.do对应的servlet ,提交到_hiddenframe2里了,即sms.do返回的结果会隐藏在_hiddenframe2中.其中通过style="display:none;"进行了隐藏。 -->

<form name="from2" id="formid2" action="sms.do" method="post" style="display:none;"  target="_hiddenframe2">
    <input type="text" name="tname" value="王五">
</form>


<!-- 加入了style="display:none;"用于隐藏 -->
<iframe name="_hiddenframe1" style="display:none;"></iframe>

<iframe name="_hiddenframe2"></iframe>

 

除上面原始的方法外,目前的ajax技术就能很方便的实现多个表单提交。可以使用目前广泛被使用的jQuery框架。

详细的使用情况,可以参考http://sy.131bz.com 中的登录及添加收藏的例子。

分享到:
评论

相关推荐

    HTML网页练习——努比亚官网.rar

    通过这个练习,你可以一步步建立起自己的网页开发技能,为未来深入学习JavaScript和其他前端技术打下坚实基础。所以,无论是对HTML5感兴趣,还是希望提升网页设计能力,都值得下载这个压缩包进行学习和实践。

    网页设计必备——html初级教程

    这个"网页设计必备——html初级教程"包含两个CHM文件:HTML入门与提高.CHM和HTML基础教程.chm,它们将帮助初学者理解并掌握HTML的基本概念和语法。 HTML入门与提高.CHM可能涵盖以下内容: 1. HTML简介:解释HTML的...

    期末前端web大作业——我的家乡陕西介绍网页制作源码

    总之,这份作业涵盖了HTML5、CSS3的基础知识点,同时也提供了一些进阶内容的学习机会,适合于希望深入学习前端开发的学生。通过实践这样的项目,不仅可以巩固已学的知识,还能提高解决实际问题的能力。

    html 和 javascript 课件 lesson3万和

    【HTML与JavaScript基础教程——Lesson3万和】 在“HTML和JavaScript课件Lesson3万和”中,我们将会深入探讨这两个关键的Web开发技术。HTML(HyperText Markup Language)是网页内容的基础结构语言,而JavaScript则...

    html5基础教程

    `&lt;canvas&gt;`元素则为动态图形和交互式内容提供了画布,结合JavaScript可以实现丰富的动画效果。 离线存储是HTML5的另一项关键特性。`&lt;html manifest&gt;`属性允许指定一个缓存清单文件,浏览器可以预先下载资源,在离线...

    商品添加代码

    在IT行业中,商品管理系统是电子商务平台的核心组成部分,而“商品添加代码”则涉及到这个系统中的一个重要环节——商品信息录入...对于初学者来说,这是一个很好的实践项目,可以帮助你巩固前端与后端开发的基础知识。

    html详解,让你从新手变高手

    本教程将通过多个章节详细讲解这些概念,并提供实例供你实践。"HTML语言学习教程——HTML语言剖析.part2.rar"和"HTML语言学习教程——HTML语言剖析.part3.rar"分别包含更多深入的内容和实战案例,确保你在学习过程...

    HTML入门教程

    9. **交互与表单**:&lt;form&gt;元素用于创建用户交互表单,、、等元素用于收集用户数据,以及和来触发表单提交。 10. **编辑与运行代码**:在本教程的chm文档中,你可以尝试编辑HTML代码并实时查看效果,这是实践学习的...

    weatherapp

    【天气应用——构建一个基础的Web界面】 "weatherapp"是一个关于创建天气应用程序的项目,主要涉及HTML(超文本标记语言)技术。HTML是构建网页的基础,它定义了网页的结构和内容。在这个项目中,我们将探讨如何...

    chapter9_exercise

    《HTML编程基础与实战练习——Chapter9_exercise详解》 HTML(HyperText Markup Language)是构建网页的基础语言,它的每一个元素都是构成网页的砖石。本篇将详细探讨"Chapter9_exercise"这一主题,通过深入理解并...

    FullStack-Bootcamp

    此外,表单(`&lt;form&gt;`)元素和输入控件(如`&lt;input&gt;`、`&lt;textarea&gt;`和`&lt;select&gt;`)是构建交互式网页的重要部分,它们允许用户输入和提交数据。 HTML与CSS(Cascading Style Sheets)和JavaScript紧密配合,实现页面...

    angular-exercise

    6. **模块**:Angular应用由多个模块组成,每个模块都可以有自己的组件、服务和路由。`AppModule`是主模块,通常在`app.module.ts`中定义。其他功能模块可以作为独立的模块导入。 7. **指令**:Angular的指令用于...

    gobarber:在Bootcamp GoStack Rocketseat课程中开发的项目

    总的来说,gobarber项目覆盖了Web开发的多个方面,从基础的HTML布局到复杂的前后端交互,是全面提升Web开发技能的理想实践平台。通过这个项目,学员不仅能够巩固理论知识,还能获得宝贵的实践经验,为未来的职业发展...

    pENDemic

    通过JavaScript或其他前端框架(如React或Vue.js)与后端数据进行交互,实现疫情数据的动态展示和模拟分析。 总结,HTML是构建网页的基石,理解并熟练掌握HTML的基本结构和语法规则,是成为一名优秀前端开发者的第...

    CompleteWeb_Exercises

    10. **JavaScript交互**:虽然不是HTML本身的一部分,但HTML通常与JavaScript一起使用,通过事件处理程序(如`onclick`、`onmouseover`)和`&lt;script&gt;`标签引入外部JS文件,为网页添加交互性。 通过"CompleteWeb_...

    史蒂夫

    【史蒂夫——HTML网页设计基础与进阶】 在IT领域,HTML(HyperText Markup Language)是构建网页的基础,被誉为互联网的"史蒂夫",它定义了网页的结构和内容。HTML允许开发者通过标记语言来创建具有文本、图像、...

    George

    JavaScript可以通过`&lt;script&gt;`标签内联编写,或链接外部JS文件。 7. HTML5新特性: - 新的语义化标签:如`&lt;header&gt;`, `&lt;nav&gt;`, `&lt;article&gt;`, `&lt;section&gt;`, `&lt;aside&gt;`和`&lt;footer&gt;`,使网页结构更清晰。 - 多媒体...

Global site tag (gtag.js) - Google Analytics