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

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 表单之间的数据传递代码

    今天有朋友问我关于用JAVASCRIPT来进行页面各表单之间的数据传递的问题，我以前也写过，不过从来没有注意，今天总结了一下，希望能够给大家一些帮助，也帮助我总结以前学过，用过的知识。

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

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

    用表单传递参数

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

    常用web数据传递

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

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

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

    javascript表单排序

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

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

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

    访问网站的参数传递代码

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

    javascript与.net的交互

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

    javascript和jsp面之间的传值.docx

    1. URL参数传递： 当用户点击某个链接或按钮时，JavaScript可以通过构建URL参数的形式来传递数据给JSP。例如，`yourJSP.jsp?param1=value1&param2=value2`。在JSP中，可以通过`request.getParameter()`方法获取这些...

    JavaScript学习笔记,javascript基础知识,基础语法整理.pdf

    * 函数可以传递参数，实现参数的传递 * 函数可以返回值，实现结果的返回 三、 JavaScript 中的对象 * 对象是JavaScript中的一种基本数据类型 * 对象是一种集合类型，包含多个键值对 * 对象可以使用点符号或括号...

    android获取html表单数据

    在Android开发中，有时我们需要与...以上就是如何在Android应用中通过JavaScript相互传递参数，间接获取HTML表单数据的详细步骤。通过这种方式，你可以轻松地在原生应用和HTML页面之间共享数据，实现更丰富的交互体验。

    蓝凌系统表单JS大全（持续更新）

    6. **表单序列化与反序列化**：JS能够将表单数据序列化为JSON格式，方便在前后端之间传递；同样，也能将接收到的JSON数据反序列化，填充到表单中，实现数据的动态加载。 7. **插件集成**：蓝凌系统支持第三方JS库的...

    AjAX JavaScript中使用表单实现留言功能

    // 发送数据，这里以URL编码的形式传递留言内容 xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { console.log('留言成功'); // 可以在此处添加成功后的操作，如...

    微信小程序例子——使用form表单获取输入框数据

    微信小程序提供了内置的表单数据校验功能，可以通过`validateFields`和`getFieldsValue`方法来对表单字段进行校验和获取值。例如： ```javascript Page({ validate() { this.selectComponent('#myForm')....

    网页间参数的传递

    表单是网页间传递数据的常见手段，可以通过`&lt;form&gt;`元素定义，指定`method`属性为GET或POST，来决定参数传递的方式。 6. URL重写和路由： 为了使URL更加友好，开发者常采用URL重写技术，隐藏参数在URL后面，但...

    数据传递 asp.net

    在这个过程中，数据通常通过请求参数（如URL参数、表单数据）或HTTP头进行传递。例如，查询字符串可以在URL中携带参数，POST请求则通过请求体传递数据。 2. 异步传输： 异步传输在ASP.NET中通常涉及到AJAX...

    JavaScript\JavaScript教程

    2. **函数式**：JavaScript支持函数作为一等公民，可以将函数作为参数传递，也可以作为返回值。 3. **原型链**：JavaScript对象基于原型继承，每个对象都有一个proto属性，指向其构造函数的原型对象。 4. **事件驱动...

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