网页间的传值

dawn

已于 2022-04-10 12:14:17 修改

阅读量1k

点赞数

分类专栏： JavaScript 文章标签： html5 javascript html

于 2012-12-15 22:59:35 首次发布

本文链接：https://blog.csdn.net/dawn0718/article/details/8300074

版权

JavaScript 专栏收录该内容

29 篇文章 1 订阅

订阅专栏

　　网页间的传值有三种方法：
　　1、通过地址栏;
　　2、通过cookie；
　　3、直接调用处理，即通过window.opener获取具体的参数，这种方法比较灵活。

　　父页面：

<html>
<head><title>网页间的参数传递[父网页]</title>
<script language="javascript">
    function test1(){
        window.open('child.html','popup',200,300)
    }
    function test2(){
        SetCookie('参数1',document.all.参数1.value,123);
        SetCookie('参数2',document.all.参数2.value,123);
        window.open('child.html','popup',200,300)
    }
    function SetCookie(Para,Value,Expiredays){
        var Exdate=new Date()
        Exdate.setDate(Exdate.getDate()+Expiredays)
        document.cookie=Para+ "=" +escape(Value)+((Expiredays==null) ? "" : ";expires="+Exdate.toGMTString())
    }
    function test3(){
        var Url=\'#\'" />        Url+="&参数2="+escape(document.all.参数2.value)
        window.open(Url,'popup',200,300)
    }
</script>
</head>
<body>
<div id=PSP style="width:300;height:300;top=50;left=50;">
参数1：<input type="text" name="参数1" /></br>
参数2：<input type="text" name="参数2" /></br>
<input type="button" value="传值" onclick="test1();"/>
<input type="button" value="Cookie传值" onclick="test2()"/>
<input type="button" value="地址栏传值" onclick="test3()"/>
</div>
</body>
</html>

　　子页面：

<html>
<head><title>网页间的传值[子网页]</title>
</head>
<script languang="javascript">
    function ViewInfo1() {
        var ParentW = window.opener;
        info="参数1："+ParentW.document.all.参数1.value;
        info+="    参数2："+ParentW.document.all.参数2.value;
        ParentW.document.getElementById('参数1').style.backgroundColor = "red";//更改背景色
        alert(info);
    }
    function GetCookie(Para){
        if (document.cookie.length>0){
            c_start=document.cookie.indexOf(Para + "=");
            if (c_start!=-1){
                c_start=c_start + Para.length+1 ;
                c_end=document.cookie.indexOf(";",c_start);
                if (c_end==-1) c_end=document.cookie.length;
                return unescape(document.cookie.substring(c_start,c_end));
            }
        }
    }
   
    function ViewInfo2(){
        var Para1=GetCookie('参数1');
        var Para2=GetCookie('参数2');
        var info="参数1："+Para1+"    参数2："+Para2;
        alert(info);
    }
    function ViewInfo3(){
        var Url=location.search;
        var ParaName=new Array();
        var ParaValue=new Array();
        var info='';
        if(Url.indexOf("?")!=-1){
            var S1 = Url.substr(1);
            var SSS = S1.split("&");
            for(var i=0;i<SSS.length;i++){
                ParaName[i]=SSS[i].split("=")[0];
                ParaValue[i]=SSS[i].split("=")[1];
            }
        }
        for(var i=0;i<ParaName.length;i++){
            if(info==''){info=ParaName[i]+"="+ParaValue[i];}
            else {
            info+="    "+ParaName[i]+"="+ParaValue[i];}
        }
        alert(info) ;
    }
</script>
<body>
<input type="button" value="直接获取参数" onclick="ViewInfo1();"/>
<input type="button" value="cookie传参数" onclick="ViewInfo2();"/>
<input type="button" value="地址栏传参数" onclick="ViewInfo3();"/>
</body>
</html>

dawn

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
网页间的传值

网页间的传值有三种方法：　　1、通过地址栏;　　2、通过cookie；　　3、直接调用处理，即通过window.opener获取具体的参数，这种方法比较灵活。　　父页面：网页间的参数传递[父网页] function test1(){ window.open('child.html','popup',200,300) }
复制链接

扫一扫

专栏目录