js教程

同域两个网页JS传值示例

我的站长站 2022-03-18 人阅读

first.html网页,通过a.js向jieshou.html传值,主要通过域名传值接受方法

<!DOCTYPE html>
<html>
        <head>
                <meta charset="UTF-8">
                <title>第一个网页</title>
        </head>
        <script type="text/javascript" src="a.js"></script>
        <body
                <form name="form1" action="jieshou.html" method="post">
                        <h3>传值</h3>
                        <input class="text_1" type="text" name="wd" id="text_1" value=""/>
                        <input type="submit" name="sousuo" id="submit_s" value="提交"/>
                </form>
        </body>
</html>

a.js文件

function sub() {
        var str = "" + document.getElementById('text_1').value;
        var url = "jieshou.html?wd=" + encodeURI(str);
        location.href = url;
}

jieshou.html接收页面

<!DOCTYPE html>
<html>
        <head>
                <meta charset="UTF-8">
                <title>接收显示</title>
        </head>
        <body>
                <form name="form2" action="">
                        <input name="xianshi" id="text_2" type="text" />
                </form>
                <script type="text/javascript">
                        var loc = location.href;
                        loc = decodeURI(loc);
                        var n1 = loc.length; //地址的总长度  
                        var n2 = loc.indexOf("=");
                        if (n2 > 0) {
                                var id = loc.substr(n2 + 1, n1 - n2);
                                document.getElementById("text_2").value = id;
                        }
                </script>
        </body>
</html>
最新更新
  • js截取字符串教程

    slice()方法接受两个参数,起始索引和结束索引(可选)。它返回从起始索引到结束索引(不包括结束索引)之间的子字符...

    js教程 3个月前
  • find findIndex indexOf索引选择器使用方法

    find使用方法find方法是ES6引入的一种数组方法,可以用来查找数组中符合条件的元素。语法是:array.find(callba...

    js教程 3个月前
  • js复制网页内容教程

    Async Clipboard API方法HTML5新增的方法,无需引入第三方插件,直接就可以复制内容。低版本的浏览器可能会不兼...

    js教程 3个月前
  • js获取字符长度函数分享

    js获取字符长度函数function objLen(str) { if (str == null) return 0; if (typeof str != "string") { ...

    js教程 3个月前
  • 网站LED跑马灯效果广告代码

    网站可以看到很多的论坛网站都会用到这种网站LED跑马灯效果,这种效果实现也很简单,分享给大家。LED跑马灯效果...

    js教程 4个月前