index.html为父页面，A.html和B.html为局部刷新的子页面。
页面跳转：
如index.html所示，用&iframe&标签实现页面的嵌套。
参数传递：
当需要传递参数时，可使用js实现为跳转页面的同时传参，获取的参数需要解码。
1.index.html
&!DOCTYPE html&
&html style="height: 100%;overflow:"&
&title&页面跳转&/title&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
&body style="height: 100%;overflow:"&
&li&&a href="A.html" target="con"&跳转A&/a&&/li&
&li&&a href="B.html" target="con"&跳转B&/a&&/li&
&iframe name="con" src="A.html"&&/iframe&
&!DOCTYPE html&
&html style="height: 100%;overflow:"&
&title&A页面&/title&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
&body style="height: 100%;overflow:"&
&h4&A页面&/h4&
&button id="bt" onclick="jump()"&传参&/button&
&script type="text/javascript"&
function jump(){
var name="跳转成功";
location.href="B.html?name="+
&!DOCTYPE html&
&html style="height: 100%;overflow:"&
&title&B页面&/title&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
&body style="height: 100%;overflow:"&
&h4&B页面&/h4&
&button id="bt" onclick="show()"&获取参数&/button&
&script type="text/javascript"&
var str=this.location.
var val1=str.split("name=");
var val2=val1[1];
val2=decodeURI(val2);
function show(){
alert(val2);
jquery刷新页面的实现代码（局部及全页面刷新）
HTML中使用Ajax进行局部刷新页面
页面局部跳转frameset
HTML页面局部刷新
web tips——href跳转页面指定部分
ajax如何实现页面局部跳转与结果返回
AJAX-实现页面内跳转实例
不用ajax的局部页面跳转实现方法（iframe）
使用AJAX实现页面跳转
没有更多推荐了，在 SegmentFault，学习技能、解决问题
每个月，我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。
问题对人有帮助，内容完整，我也想知道答案
问题没有实际价值，缺少关键内容，没有改进余地
首先是不能通过服务端转发数据哦，然后要传的参数是数组，如果太多的话，用querystring也不好，然后用cookies是可以，但是cookies的本意不是这样用的，而且我以前依稀听说html5有一种更好的传值方式的，请问那个是什么？
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
使用localStorage存储数据
分享到微博？
关闭理由：
删除理由：
忽略理由：
推广（招聘、广告、SEO 等）方面的内容
与已有问题重复（请编辑该提问指向已有相同问题）
答非所问，不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因（请补充说明）
我要该，理由是：
在 SegmentFault，学习技能、解决问题
每个月，我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。html怎样实现页面跳转时传递参数
原创
 09:25:45
331
这次给大家带来html怎样实现页面跳转时传递参数，html怎样页面跳转时传递参数的有哪些，下面就是实战案例，一起来看一下。a页面点击跳转后在b页面可以获取到对应的值。&!DOCTYPE html&
&head lang=&en&&
&meta charset=&UTF-8&&
&script src=&js/jquery-3.0.0.min.js&&&/script&
&script src=&js/jquery.params.js&&&/script&
&title&a页面&/title&
$(function(){
name = $(&#name&).text();
age = $(&#age&).text();
$(&#btn&).on(&click&,function(){
function jump1(){
url = &b.html?name=&+name+&&age=&+//此处拼接内容
window.location.href =
&div id=&name&&tony&/div&
&div id=&age&&23&/div&
&button id=&btn&&跳转&/button&
&/html&将要跳转到的b页面:&!DOCTYPE html&
&head lang=&en&&
&meta charset=&UTF-8&&
&script src=&js/jquery-3.0.0.min.js&&&/script&
&script src=&js/jquery.params.js&&&/script&
&title&b页面&/title&
$(function(){
getData1();
function getData1(){
var name = $.query.get(&name&);
var age = $.query.get(&age&);
$(&#name&).text(name);
$(&#age&).text(age);
&div id=&name&&&/div&
&div id=&age&&&/div&
&/html&相信看了这些案例你已经掌握了方法，更多精彩请关注php中文网相关文章！相关阅读：以上就是html怎样实现页面跳转时传递参数的详细内容，更多请关注php中文网其它相关文章！
江湖传言：PHP是世界上最好的编程语言。真的是这样吗？这个梗究竟是从哪来的？学会本课程，你就会明白了。
PHP中文网出品的PHP入门系统教学视频，完全从初学者的角度出发，绝不玩虚的，一切以实用、有用...
ThinkPHP是国内最流行的中文PHP开发框架,也是您Web项目的最佳选择。《php.cn独孤九贱(5)－ThinkPHP5视频教程》课程以ThinkPHP5最新版本为例，从最基本的框架常识开始，将...
《php.cn原创html5视频教程》课程特色：php中文网原创幽默段子系列课程，以恶搞，段子为主题风格的php视频教程！轻松的教学风格，简短的教学模式，让同学们在不知不觉中，学会了HTML知识。
本套教程,以一个真实的学校教学管理系统为案例,手把手教会您如何在一张白纸上,从零开始,一步一步的用ThinkPHP5框架快速开发出一个商业项目。
所有计算机语言的学习都要从基础开始，《PHP入门视频教程之一周学会PHP》不仅是PHP的基础部分更主要的是PHP语言的核心技术，是学习PHP必须掌握的内容，任何PHP项目的实现都离不开这部分的内容，通...
本课以最新版ThinkPHP5.0.10为基础进行开发，全程实录一个完整企业点，从后台到前台，从控制器到路由的全套完整教程，不论是你是新人，还是有一定开发经验的程序员，都可以从中学到实用的知识~~
ThinkPHP是一个快速、开源的轻量级国产PHP开发框架，是业内最流行的PHP框架之一。本课程以博客系统为例，讲述如何使用TP实战开发，从中学习Thinkphp的实践应用。模版下载地址：http:/...
本课程是php实战开发课程，以爱奇艺电影网站为蓝本从零开发一个自己的网站。目的是让大家了解真实项目的架构及开发过程
本课以一个极简的PHP开发框架为案例,向您展示了一个PHP框架应该具有的基本功能，以及具体的实现方法，让您快速对PHP开发框架的底层实现有一个清楚的认识,为以后学习其实的开发框架打下坚实的基础。
javascript是运行在浏览器上的脚本语言，连续多年，被评为全球最受欢迎的编程语言。是前端开发必备三大法器中，最具杀伤力。如果前端开发是降龙十八掌，好么javascript就是第18掌：亢龙有悔。...
本站9月直播课已经结束,本套教程是直播实录,没有报上名或者漏听学员福利来了，赶紧看看吧，说不定这里就有你的菜
轻松明快，简洁生动，让你快速走入HTML5的世界，体会语义化开发的魅力
JavaScript能够称得上是史上使用最广泛的编程语言，也是前端开发必须掌握的三技能之一：描述网页内容的HTML、描述网页样式的CSS以及描述网页行为的JavaScript。本章节将帮助大家迅速掌握...
Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 WEB 项目。为所有开发者、所有应用场景而设计,它让前端开发更快速、简单，所有开发者都能快速上手...
《php.cn独孤九贱（2）－css视频教程》课程特色：php中文网原创幽默段子系列课程，以恶搞，段子为主题风格的php视频教程！轻松的教学风格，简短的教学模式，让同学们在不知不觉中，学会了CSS知识...
《php用户注册登录系统》主要介绍网站的登录注册功能,我们会从最简单的实现登录注册功能开始，增加验证码，cookie验证等，丰富网站的登录注册功能
jQuery是一个快速、简洁的JavaScript框架。设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的...
《PHP学生管理系统视频教程》主要给大家讲解了HTML，PHP，MySQL之间的相互协作，实现动态的网页显示和获取数据.
《弹指间学会HTML视频教程》从最基本的概念开始讲起，步步深入，带领大家学习HTML,了解各种常用标签的意义以及基本用法，学习HTML知识为以后的学习打下基础
《最新微信小程序开发视频教程》本节课程是由微趋道录制，讲述了如何申请一个微信小程序，以及开发中需要使用哪些工具，和需要注意哪些等。
php中世界最好的语言
全栈工程师
文章总浏览数HTML页面之间跳转与传值（JS代码） - mingmingcome - 博客园
随笔 - 11, 文章 - 0, 评论 - 1, 引用 - 0
跳转的方法如下：
window.location.href = "b.html";
方法二（返回上一个页面，这个应该不算，先放在这）：
window.history.back(-1);
self.location = "b.html";
top.location = "b.html";
有关问题的思考：
第一，为什么给window.location和window.location.href赋值时一样的，都可以跳转？
location是location.href的简写，无论是访问值还是赋值。
从功能上，location等于location.
但从本体论上，location是一个对象，location.href是它的一个属性。
这种怪异的行为应该是为了兼容无疑。
第二，给location赋值的时候，如果跳转的页面不是在同一个目录下，需要把完整的URL写上。如：当前location.href为https://www.google.com/&，如果要跳转到https://www.baidu.com/, 就不能只是www.baidu.com,必须把URL写完整。
传值的方法如下：
方法一：URL传参（？后面的参数）（去哪儿网笔试题，把URL后面的参数解析为对象）
window.location.href = "https://www.google.com/search?q=hello&oq=hello"
function parseURL(url){
& & var url = url.split("?")[1];
& & var para = url.split("&");
& & var len = para.
& & var res = {};
& & var arr = [];
& & for(var i=0;i&i++){
& & & & arr = para.split("=");
& & & & res[arr[0]] = arr[1];
方法二：cookie传参
function setCookie(cname,cvalue,exdays){
& & var d = new Date();
& & d.setTime(d.getTime() + (exdays*24*60*60*1000));
& & var expires = "expires=" + d.toUTCString();
& & document.cookie = cname + "=" + cvalue + "; " +
function getCookie(cname){
& & var name = cname + "=";
& & var ca = document.cookie.split(";");
& & for(var i=0;i&ca.i++){
& & & & var c = ca[i];
& & & & while(c.charAt(0)==' '){
& & & & & & c = c.substring(1);&
& & & & if(c.indexof(cname) == 0){
& & & & & & return c.substring(name.length,c.length);
& & return "";
方法三：H5中Web Storage中的localStorage对象
localStorage.setItem("lastname","lu");
localStorage.lastname = "lu";
localStorage.getItem("lastname");
localStorage.vue页面跳转参数传递
vue页面跳转参数传递，前段时间项目用vue搭建整个前端页面，我负责的模块有个地方在页面跳转时得将参数传递到下一个页面，但是由于参数较多，用url带参数传递不是特别好，我尝试了多种方法想在页面之间传递参数都没成功，最后想到了vuex，当时又是刚开始学vue对vuex更是了解不多废了一点时间，好在问题解决了，下面分享我解决问题的代码，希望对大家有所帮助。
一.页面跳转通过路由带参数传递数据
// 1.页面中的代码
this.$router.push({
name: 'generalAdminOrderFlowAdd',
type: 'add',
templateType: this.orderTemplateType
// 2.路由中的代码
path: ':type/:templateType',
name: 'generalAdminOrderFlowAdd',
component:
require('@/components/generalAdmin/order/orderFlow')
// 3.获取页面中的参数值
let type = this.$route.params.type
二.使用vuex进行数据传递
// 1.index.js页面代码
import Vue from 'vue'
import Vuex from 'vuex'
import mutations from './mutations'
import actions from './actions'
import getters from './getters'
Vue.use(Vuex)
const state = {
order: {} //声明order对象
export default new Vuex.Store({
mutations,
//2. getters.js页面的代码
export default {
// 声明获取order的方法
getOrder (state) {
return state.order
//3. mutation.js页面的代码
export default {
//设置order的值
SET_ORDER (state, order) {
state.order = order
// 4.在页面中设置调用set方法设置全局order的值
this.$store.commit('SET_ORDER', order)// SET_ORDER为order值的设置方法的方法名
// 5.获取全局的order值
// 从vuex中获取order
let template = this.$store.state.order