`
zhongzhihua
  • 浏览: 313816 次
  • 来自: ...
社区版块
存档分类
最新评论

javascript表单之间的数据传递

JavaScript框架HTMLXML 
阅读更多
xml 代码
  1. javascript表单之间的数据传递    
  2. 一，最简单的就是同一个网页里的表单的数据传递。    
  3.   
  4.      举个实例，一个网页上有两个表单，每个表单里一个文本框，一个按钮。点按钮互相对操作对方的文本框的值。我们举的例子是把一个文本框付给另一个文本框。具体的HTML代码如下：   
  5.   
  6.   
  7. CODE:<html>  
  8. <head>  
  9. <title>Untitled Document</title>  
  10. <meta http-equiv="Content-Type" content="text/html; charset=gb2312">  
  11. </head>  
  12. <body>  
  13.   
  14. <form name="form1" method="post" action="">  
  15.   <input type="text" name="textfield">  
  16.   <input type="button" name="Submit" value="1---------&gt;2" onClick="ok()">  
  17. </form>  
  18.   
  19. <form name="form2" method="post" action="">  
  20.   <input type="text" name="textfield2">  
  21.   <input type="button" name="Submit" value="2-----&gt;1" onClick="ok1()">  
  22. </form>  
  23.   
  24. </body>  
  25. </html>  
  26. 以上为HTMl的代码，大家可能注意到了onclik的代码了，有两个函数，接下来就是JAVASCRIPT的代码了：   
  27.   
  28.   
  29. CODE:<script language="JavaScript">  
  30. function ok()   
  31. {   
  32.   documentdocument.form2.textfield2.value=document.form1.textfield.value;   
  33. }   
  34. function ok1()   
  35. {   
  36. documentdocument.form1.textfield.value=document.form2.textfield2.value;   
  37. }   
  38. </script>  
  39. 二，第二种是两个窗口之间的表单的文本框之间数据传递。   
  40.   
  41.   其实这个可以在原来的基础上进行一些扩展就可以了。关于如何创建弹出窗口，窗体里的表单的代码， 在这里就不多说了，现在在这里说一下如何操作父窗口的表单里的文本框的数据。具体代码如下：   
  42.   
  43.   
  44. CODE:<script language="JavaScript">  
  45. function ok()   
  46. {   
  47.   opener.document.form2.textfield2.value=document.form1.textfield.value   
  48. }   
  49. </script>  
  50. 三，第三种就是框架网页之间的表单的文本框之间数据传递.   
  51.   
  52.         注意的地方是框架的写法：   
  53.   
  54.   
  55. CODE:<frameset cols="505,505">  
  56.   <frame src="test.htm" name="leftr" id="leftr">//定义框架的名称   
  57.   <frame src="test2.htm" id="right" name="right">  
  58. </frameset>  
  59. <noframes><body>  
  60.   
  61. </body></noframes>  
  62. 具体的实现代码如下：   
  63.   
  64.   
  65. CODE:<script language="JavaScript">  
  66. function ok()   
  67. {   
  68.   parent.leftr.document.form2.textfield2.value=document.form1.textfield.value   
  69. }   
  70. </script>  
  71. 这三种窗口之间的文本框数值互相操作的简单方法就实现了，其它需要注意的就是他们之间的关系。    
分享到：
| 怎么用properties
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    Javascript_表单之间的数据传递

    ### JavaScript 表单之间的数据传递 #### 知识点概览 - **JavaScript与HTML结合进行数据传递** - **表单元素的选择与操作** - **事件处理函数的应用** - **不同窗口或框架间的通信** #### 知识点详解 ##### ...

    Javascript 表单之间的数据传递代码

    Javascript表单之间的数据传递主要涉及在同一网页的表单、不同窗口之间、以及框架网页间的表单数据共享。以下是详细的知识点： 一、同一网页内表单之间的数据传递 在同一网页内，我们可以使用JavaScript的DOM操作来...

    页面表单数据传递

    本文将深入探讨如何利用JavaScript实现页面表单数据的高效传递，包括同一页面内的表单数据传递、不同窗口间的表单数据交换以及框架网页中的表单数据同步，以期为前端开发者提供实用的解决方案。 #### 同一页面内的...

    传递表单参数

    本文将详细介绍如何在MVC架构下传递表单参数，并探讨几种常用的表单数据传递方法。 #### 表单参数概述 在Web应用中，表单参数通常是指用户通过表单填写的数据。这些数据可以是文本、数字、日期等不同类型的信息。...

    两个网页之间参数传递例子

    总结来说，网页间参数传递涉及URL查询字符串、表单提交、cookies、localStorage/sessionStorage、URL fragment identifier以及AJAX请求等多种技术。理解并熟练运用这些方法，能让你在构建交互式Web应用时更加...

    用表单传递参数

    在前端，JavaScript可以使用FormData对象将表单数据序列化为POST请求所需的格式。在后端，服务器需要将接收到的请求体数据反序列化为可操作的对象。 总结来说，“用表单传递参数”涉及到HTML表单设计、数据提交方式...

    java变量和javascript变量之间的传递示例

    此外，为了解决变量不同步的问题，可以使用参数传递的方式，在JavaScript函数内部进行变量的同步更新。通过表单的隐藏字段将值传递到Java端进行处理后，利用`request.getParameter()`方法获取表单提交的数据，从而...

    常用web数据传递

    在Web开发中，数据传递是不可或缺的一环，尤其是在基于Java技术的JSP、JavaScript和Servlet环境中。本篇文章将深入探讨这些技术之间的数据交互方式，帮助开发者更好地理解和掌握这些常用的数据传递方法。 首先，...

    jQuery+json异步实现JSP和struts2之间的数据传递

    "jQuery+json异步实现JSP和struts2之间的数据传递"是一个典型的应用场景，它结合了前端JavaScript库jQuery与后端MVC框架Struts2，通过JSON这种轻量级的数据交换格式进行高效的数据交互。下面我们将详细探讨这一主题...

    form提交时传递额外的参数几种常见方法

    在实际开发中，开发者需要根据业务的具体需求以及对用户体验的考虑来选择最合适的参数传递方式。如果额外参数不是很关键，并且对表单提交体验要求不高，使用隐藏input的方法可能是最简便的。如果希望在不干扰用户...

    javascript表单排序

    在本主题中，我们将深入探讨如何使用JavaScript对表单数据进行排序。表单数据排序是网页应用中常见的需求，例如，用户可能需要按照特定字段对搜索结果或列表进行升序或降序排列。 首先，理解表单的基本结构至关重要...

    Layui实现父子页面之间值传递.zip

    这种传递方式适用于页面间不涉及服务器交互的情况，如果需要服务端参与，可以考虑使用路由参数或者存储在缓存中来传递数据。在实际项目中，需要注意安全性问题，确保数据在传递过程中的安全性。

    访问网站的参数传递代码

    2. **Ajax异步请求**：使用JavaScript的XMLHttpRequest对象或现代浏览器的Fetch API，可以向服务器发送POST请求，同时保持页面不刷新，实现参数传递。 **三、Cookie和Session的使用** 1. **Cookie**：服务器可以...

    巧用JavaScript创建智能表单效果

    ### 巧用JavaScript创建智能表单效果 ...以上方法展示了如何使用JavaScript创建智能表单效果以及如何处理字符串和传递参数的基本概念。通过这些技术的应用，可以极大地提高Web应用程序的功能性和用户体验。

    HTML页面地址栏参数传递与获取

    - **表单提交**：当不需要提交到服务器时，可以直接通过URL参数传递表单数据。 - **页面跳转**：在跳转到新页面时，可以通过URL携带必要的数据。 - **状态维护**：对于不需要持久化存储的状态信息，可以通过URL参数...

    javascript与.net的交互

    JavaScript 和 .NET 之间的交互是现代 Web 应用程序开发中的关键组成部分，它允许客户端的动态脚本语言与服务器端的强类型编程语言协同工作，从而实现丰富的用户体验和高效的服务器资源管理。本文将深入探讨 ...

    js提交form表单,并传递参数的实现方法

    inputData="+hasInputed+"&artType="+type`，这表示表单数据将被提交到相对路径为`../news/starList.do`的服务器端处理程序，并且将要传递的参数通过URL的查询字符串附加在`action`地址后。 查询字符串是一种在URL...

    php和javascript之间变量的传递实现代码

    本文介绍了几种在PHP和JavaScript之间传递变量的方法，包括直接在JavaScript代码中嵌入PHP变量、通过表单元素在PHP和JavaScript之间传递变量以及JavaScript向表单元素传递数据的方式。通过这些示例，可以有效地实现...

    javascript表单处理具体实现代码(表单、链接、按钮).docx

    ### JavaScript表单处理技术详解 #### 一、概述 在Web开发中，JavaScript常被用于增强用户交互体验，其中表单处理是极为重要的一环。本文档将详细介绍如何使用JavaScript来处理网页中的表单元素，包括但不限于表单...

Magicbox
Global site tag (gtag.js) - Google Analytics