静态界面传值javascript

一:JavaScript静态页面值传递之URL篇
能过URL进行传值.把要传递的信息接在URL上.
Post.htm

复制代码代码如下:

<input type="text" name="username">
<input type="text" name="sex">
<input type="button" value="Post">
<script language="javascript" >
function Post()
{
//单个值 Read.htm?username=baobao;
//多全值 Read.htm?username=baobao&sex=male;
  url = "Read.htm?username="+escape(document.all.username.value);
url += "&sex=" + escape(document.all.sex.value);
location.href=url;
}
</script>

Read.htm

复制代码代码如下:

<script language="javascript" >
/*
*--------------- Read.htm -----------------
* Request[key]
* 功能:实现ASP的取得URL字符串,Request("AAA")
* 参数:key,字符串.
* 实例:alert(Request["AAA"])
*--------------- Request.htm -----------------
*/
var url=location.search;
var Request = new Object();
if(url.indexOf("?")!=-1)
{
var str = url.substr(1) //去掉?号
  strs = str.split("&");
for(var i=0;i<strs.length;i++)
{
   Request[strs[i ].split("=")[0]]=unescape(strs[ i].split("=")[1]);
}
}
alert(Request["username"])
alert(Request["sex"])
</script><script language="JavaScript">
<!--
function Request(strName)
{
var strHref = "www.jb51.net/index.htm?a=1&b=1&c=测试测试";
var intPos = strHref.indexOf("?");
var strRight = strHref.substr(intPos + 1);
var arrTmp = strRight.split("&");
for(var i = 0; i < arrTmp.length; i++)
{
var arrTemp = arrTmp[i ].split("=");
if(arrTemp[0].toUpperCase() == strName.toUpperCase()) return arrTemp[1];
}
return "";
}
alert(Request("a"));
alert(Request("b"));
alert(Request("c"));
//-->
</script>
<script>
String.prototype.getQuery = function(name)
{
var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
var r = this.substr(this.indexOf("?")+1).match(reg);
if (r!=null) return unescape(r[2]); return null;
}
var str ="www.jb51.net/index.htm?a=1&b=1&c=测试测试";
alert(str.getQuery("a"));
alert(str.getQuery("b"));
alert(str.getQuery("c"));
</script>

优点:取值方便.可以跨域.
缺点:值长度有限制

二:JavaScript静态页面值传递之Cookie篇
Cookie是浏览器存储少量命名数据.
它与某个特定的网页或网站关联在一起.
Cookie用来给浏览器提供内存,
以便脚本和服务器程序可以在一个页面中使用另一个页面的输入数据.
Post.htm

复制代码代码如下:

<input type="text" name="txt1">
<input type="button" value="Post">
<script language="javascript" >
function setCookie(name,value)
{
/*
*--------------- setCookie(name,value) -----------------
* setCookie(name,value)
* 功能:设置得变量name的值
* 参数:name,字符串;value,字符串.
* 实例:setCookie(‘username‘,‘baobao‘)
*--------------- setCookie(name,value) -----------------
*/
var Days = 30; //此 cookie 将被保存 30 天
  var exp = new Date();
exp.setTime(exp.getTime() + Days*24*60*60*1000);
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
location.href = "Read.htm"; //接收页面.
}
</script>

Read.htm

复制代码代码如下:

<script language="javascript" >
function getCookie(name)
{
/*
*--------------- getCookie(name) -----------------
* getCookie(name)
* 功能:取得变量name的值
* 参数:name,字符串.
* 实例:alert(getCookie("baobao"));
*--------------- getCookie(name) -----------------
*/
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr !=null) return unescape(arr[2]); return null;
}
alert(getCookie("baobao"));
</script>

优点:可以在同源内的任意网页内访问.生命期可以设置.
缺点:值长度有限制.

三:JavaScript静态页面值传递之Window.open篇
这两窗口之间存在着关系.父窗口parent.htm打开子窗口son.htm
子窗口可以通过window.opener指向父窗口.这样可以访问父窗口的对象.
Post.htm

复制代码代码如下:

<input type=text name=maintext>
<input type=button value="Open">
Read.htm
<script language="javascript" >
//window.open打开的窗口.
//利用opener指向父窗口.
var parentText = window.opener.document.all.maintext.value;
alert(parentText);
</script>

优点:取值方便.只要window.opener指向父窗口,就可以访问所有对象.不仅可以访问值,还可以访问父窗口的方法.值长度无限制.
缺点:两窗口要存在着关系.就是利用window.open打开的窗口.不能跨域.

时间: 2024-08-28 14:15:58

静态界面传值javascript的相关文章

JavaScript界面传值与前后台互调

话说曾在校时,前端的第一门课程HTML静态网页设计,其老师,真是应了他的名字: 路遥知马力. 整个学期硬是全部在 Dreamwear 中进行拖拽控件来教学,未曾教授一句代码.成功忽悠了全体学生,课上一本正经的胡说八道,对拖拽控件的心得侃侃而谈,想想也是讽刺,同期的学生都是纯手写编辑界面,我们却依旧沉浸在设计下的拖拽操作中,带来的就是界面看起来还像回事,只是源码惨不忍睹,后来有幸在网上观看了燕十八老师的HTML系列视频,犹如冬服参汤,醍醐灌顶.使我终没有在拖拽的路上越走越远. 1.前台界面互调传值

JS实现HTML静态页传值的方法

JS实现HTML静态页传值的方法 作者:前端开发-武方博 发布:2012-10-29 分类:javascript 阅读:8,735次 此处使用JS方式实现静态页之间值传递,其实很简单,废话不多说,见代码,先看index.html页代码,如下: 在body标签之间 加此行代码 <form action=”a.html?d1=123&d2=你好” method=”post” name=”f1″ id=”f1″><input type=”submit” name=”s1″ id=”s1

界面传值,单例,模态

v 界面间传值场景 1.由前往后属性传值.在后一个界面中定义属性(属性类型和数据类型一致) 2.当push到下一个界面之前给属性赋值3.在下一个界面中,对应的控件从属性中获取数据 2. 由前往后 协议代理,1.在后一个界面定义协议(协议中定一个传值方法,方法由参数,参数类型和传输类型一致)2.在后一个界面定义代理属性,3.在前一个界面中设置代理4.代理对象的类服从协议 3.多界面传值(即可以从前往后,也可以从后往前) 单例一个类只有一个对象 1.新建一个单例类 2.添加便利构造器方法并且保证该方

界面传值

属性传值 1.属性传值用于第一个界面向第二个界面传值 2.明确两者联系的桥梁,也就是触发跳转的地方 3.明确传输的值  类型是什么 4.在第二个视图控制器内部声明相对应类型的属性 来接收传输的值 5.在第二个界面使用传入的值 1.声明协议 UI中的协议为当前类名 + Delegate 2.  声明代理 3.代理对象执行协议 4.指定第二个界面的代理对象为自己 5.接收协议 6.实现协议中的方法

属性传值,协议传值,block传值,单例传值四种界面传值方式

一.属性传值 对于属性传值而言,相对于其它的三种 方法来说,是最基础,最简单的一种 方法,但,属性传值 有很大的局限性,因为是适用于第一个界面向第二个界面传 值,第二个向第三个界面传值等等.N界面向N + 1界面传值.而在此基础上,必须知道跳转界面的明确位置及所要传的值的具体类型.在第二个界面中声明所要传值 类型的属性. @interface SecondViewController : UIViewController //声明一个字符串属性来保存第一个界面传过来的字符串内容 @propert

iOS-跨界面传值和跨应用传值

跨界面传值 从一个界面将一个结果值传到另一个界面,这个是我们在开发过程中非常常见的一个问题.传值本身并不是一个太复杂的问题,在此主要简述一下常用的传值方法. 我们传值常用的方法主要有四种: 1.属性传值 2.代理传值 3.block传值 4.通知传值 属性传值: 属性传值应该来说是比较简单的一种传值方式,但是这种传值方式有其局限性,常用的一种场合是我们从界面A跳转到界面B,如何我们想讲界面A的值传到界面B,属性传值是比较方便的一种方式.如下图所示,如果我们点击A界面上的一个按钮,跳转到B界面,并

iOS UI08_TableView界面传值

实现两个界面之间内容的传递 // // MainViewController.m // UI08_TableView界面传值 // // Created by dllo on 15/8/7. // Copyright (c) 2015年 zhozhicheng. All rights reserved. // #import "MainViewController.h" #import "SecondViewController.h" @interface Main

iOS中block用法之两个界面传值问题

Block的使用有很多方面,其中传值只是它的一小部分,但是很常用更实用,下面介绍Block在两个界面之间的传值用法: 先说一下思想: 首先,创建两个视图控制器,在第一个视图控制器中创建一个Label和一个Button,其中Label是为了显示第二个视图控制器传过来的字符串, Button是为了push到第二个界面. 第二个界面的只创建一个TextField,是为了输入文字,当输入文字并且返回第一个界面的时候(第二个视图将要消失的时候),就将这个 TextFiled中的文字传给第一个界面并且显示在

iOS开发- 界面传值(1)-通知模式(广播)

之后的几篇博客, 记录下不同界面间传值的常用办法. 这篇文章记录广播的方式. iOS的设计模式中,通知模式也是其中重要的模式之一,Notification直译为通知,其实本人觉得叫做广播模式更为贴切.它的作用就是一个对象对多个对象的同步操作.用法很简单,一个对象发出一个广播,需要收听的听众就先注册一下,然后选定频道,完了就可以收听广播的内容了. 但是要注意一点, 在收听之前, 一定要先注册. 不然发送的广播接受不到, 也就是值改变了, 不会做出响应. 下面是一个简单的demo, 效果如下: 第一