html页面跳转传递参数

html-css04

html页面跳转传递参数,第1张

页面跳转的时候可能需要一些数据的传输,如商品跳转到详情页需要传一个id过去。那么在html中如何来实现呢?

简单的来说就是通过location.href设置路径的时候通过?拼接的形式拼接进去一些参数。然后在b页面通过地址栏的信息来拿到这些参数,从而进行不同的数据渲染。

例子:

a页面内容:

b页面:

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>

希望能帮到你哦!