本人刚开始写前端,目前用的是layui的框架,有一个不是特别明白
现在有一个需求,前一个页面的id需要传入后一个页面的按钮中,前一个页面已经传参过去了,后面一个页面如何接收呢?
有两种方法,一种是通过url传值,另一种放在请求域中,通过attribute传值
你说的就是这个吧,主要是第二个页面如何接收这个值呢
用url参数.,参考代码
前一页面
var id = "345";
url = 'xxxxxxx.html?id='+id;
location.href = url;
后一页面xxxxxxx.html
var request = (function (){
var obj = {};
var arr = window.location.search.slice(1).split("&");
for (var i = 0, len = arr.length; i < len; i++) {
var nv = arr[i].split("=");
obj[decodeURIComponent(nv[0]).toLowerCase()] = decodeURIComponent(nv[1]);
}
return obj;
})();
alert(request['id']);
第一页. html? id=345
第二页获取到URL截取id
<a href="javascript:" title="分配按钮" lay-event="fenpei">分配按钮</a>
table.on("tool(tableFilter)", function (obj) {
let data = obj.data;
switch (obj.event) {
case "fenpei":
fenpei(data);
break;
case "del":
del(data);
break;
}
});
function fenpei(data) {
layer.confirm('您确定要分配任务吗?',{btn: ['确定', '取消'],title:"提示"}, function(){
layer.open({
type: 2,
content: 'fenpei.html?id='+data.id //给静态页面传递id,data.id获取id,是你table表格里的那个 field 的字段
});
});
}
然后到:
fenpei.html页面可以这样获取:
function getQueryString(name) {
var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
var r = window.location.search.substr(1).match(reg);
if (r != null) {
return unescape(r[2]);
}
return null;
}
然后通过 let dataid = getQueryString('id'); 获取传递过来的id
然后进行赋值到你需要的地方
比如
一个隐藏域:
<input type="hidden" name="id" id="id" value="" lay-verify="required">
可以通过
$("#id").val(dataid );
可以通过url传参,然后在另一个页面获取传递的参数即可
用 layer.open 打开新页面 然后在content中 url后面通过 ?id=345 传递过去
可以先存到 LocalStorage
里读完了再删掉(不算是什么主流的方法但是可以解决)
可以放vuex中或本地
我用的也是layui框架,我是这样写的:
function getUrlParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if (r != null) return decodeURI(r[2]); return null;
}
运用超连接!
跳转前页面传递:
利用问号url传值(为保证数据安全这里可以加入btoa加密或其他可逆加密手法)
window.location.href="result.html?id="+id;
1
跳转后页面接收:
利用分割url字符串来获得传递内容.(如若传递的时候进行了加密,这里需要解密)
var id=decodeURIComponent(location.search.slice(1).split("=")[1]);
1
也可以考虑使用localStorage传值 但是会受到浏览器限制.