html如何两个页面之间相互传递数据

html-css06

html如何两个页面之间相互传递数据,第1张

1、使用表单传递数据

两个html页面，a.html,b.html想。把a.html中的表单form中的id和pwd传到b.html中

<form action="b.html" method="post" name="formName"></form>

要用form表单配合后台语言来传，发送类型POST和GET看你需求要换。

2、使用JS传递接收数据

<html1 ><input type="text" value="nihao" id="text"></html>

<html2></html>

如何用JS把HTML1中的text属性值nihao 传递给html2  在HTML2中有怎样用JS接收传递过来的数据并显示。

<html1><a href="html2.html?word=nihao"><a>

<html2>

js代码:

var str=location.href.search//取地址参数部分

word = str.sbustr(str.indexOf('=')+1)

word就可以获得地址中传递的参数了；如果有多个参数可以用split函数

3、两个纯Html之间的传值实例

index1.htm页面

<HTML>

    <HEAD>

    <TITLE> New Document </TITLE>//标题

        <SCRIPT LANGUAGE="JavaScript"> //调用JavaScript方法   

        function show(){       

         var result = document.getElementByIdx("name").value  //获取值.     

          location.href="index2.htm?name="+result  //  链接跳转

                      }

        </SCRIPT>

          <style>.input7 {color: #999width:145pxheight:20pxborder: 1px solid #CCCCCC font-size:12pxbackground-color: #fff}//css样式

          </style>

    </HEAD>

    <BODY>

    <input type="text" id="name" class="input7"><input type="button" value="OK" onclick="show()"/>//输出

    </BODY>

</HTML>

index2页面：

<HTML>

<HEAD>

<TITLE> New Document </TITLE>

<SCRIPT LANGUAGE="JavaScript">

function getvalue(name){    

    var str=window.location.search   //location.search是从当前URL的?号开始的字符串     

    if (str.indexOf(name)!=-1)//判断是否收到值

     {                

     var pos_start=str.indexOf(name)+name.length+1  //解析获取值   

     var pos_end=str.indexOf("&",pos_start)        

     if (pos_end==-1){           

      alert( str.substring(pos_start))  //输出      

                      }

     else{           

      alert("没有此值~~")    

          }  

      }

</SCRIPT>

</HEAD>

<BODY>

<input type="button" onclick="getvalue('show')" value="GetValue"/>

</BODY>

</HTML>

一、通过<a href="目标网页地址">进行跳转；

二、要传值的话可以在href属性中这样添加：

        href="目标地址?第一个值的名称=值&第二个值的名称=值"

说明：在上面的href属性中：“？”后面接要传的值；

“name=value”表示传值得形式，名称=值；

“&”表示多个值的连接；

看下面一个例子，你应该更明白了：

例：href=“index.html?name=zhangsan&password=123456”

三、简单说一下，在html中这样直接跳转传值没什么意义，因为html无法直接使用。如果是使用jsp的话倒是可以。提醒一句，一般带数据的跳转会经过后台处理后，再进行跳转至另一个页面！

满意的话，请五星好评采纳！O(∩_∩)O~

html是静态页面，可以使用url链接传值，比如a.html和b.html两个页面

a.html中有一个链接

1

<a href="b.html?x=2&y=3">进入b.html</a>

可以使用到js，如下：

a.htm:

1

2

3

4

<form action="b.htm" >

<input name="q" type="text" value="" />

<input type="submit" value="提交" id="" />

</form>

b.htm

<html>

<body>

<div id="qbox"></div>

<script type="text/javascript">

function getArgs() {

var args = {}

var query = location.search.substring(1)

// Get query string

var pairs = query.split("&")

// Break at ampersand

for(var i = 0i <pairs.lengthi++) {

var pos = pairs[i].indexOf('=')

// Look for "name=value"

if (pos == -1) continue

// If not found, skip

var argname = pairs[i].substring(0,pos)// Extract the name

var value = pairs[i].substring(pos+1)// Extract the value

value = decodeURIComponent(value)// Decode it, if needed

args[argname] = value

// Store as a property

}

return args// Return the object

}

var str =getArgs()

alert(str['q'])//和input的name对应取值,

document.getElementById("qbox").innerHTML = str['q']//然后赋值给DIV

</script>

</body>

</html>

希望能帮到你哦！