layui使用form表单实现post请求页面跳转的方法


Posted in Javascript onSeptember 14, 2019

如下所示:

window.location.href='url?param=' + paramValue;

上面这种方式实现页面跳转附带参数,容易造成信息泄露;

layui使用form表单实现post请求,避免信息泄露(设置form表单隐藏,也可以初始化时隐藏):

这里是在数据表格查询数据时的按钮操作,其他操作类似

<table id="myTable" class="layui-table" lay-filter="myTableDetail" ></table>

数据表格具体配置查看layui文档

<script type="text/html" id="detailBar">
 <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">详情</a>
</script>

下面action部分可以是具体的请求路径,亦可以使*.do请求

<form action='${basepath}/requestMethodName' method='post' name='form1' style='display:none'>

 <input type=hidden name='param1' id="param1" value=''>
 <input type=hidden name='param2' id="param1" value=''>
</form>

js部分:

table.on('tool(myTable)', function(obj){
   var data = obj.data; // 选中的单条数据信息,后台传过来的数据全部可以获取
   if(obj.event === 'detail'){ // 监听上面定义的按钮
    // layer.msg('ID:'+ data.ID+ ' 的查看操作');
    // 提交前设置提交数据,需要向后台传输的数据,
    $('#param1').prop("value", data.param1);
    $('#param2').prop("value", data.param2);
    document.form1.submit();
   } 
 });

以上这篇layui使用form表单实现post请求页面跳转的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
IE图片缓存document.execCommand(&quot;BackgroundImageCache&quot;,false,true)
Mar 01 Javascript
JS 加入收藏夹的代码(主流浏览器通用)
May 13 Javascript
jQuery实现瀑布流布局
Dec 12 Javascript
JS控制表格实现一条光线流动分割行的方法
Mar 09 Javascript
限制只能输入数字的实现代码
May 16 Javascript
Bootstrap模块dropdown实现下拉框响应
May 22 Javascript
详解jQuery中的事件
Dec 14 Javascript
vue 将页面公用的头部组件化的方法
Dec 18 Javascript
vue elementUI table 自定义表头和行合并的实例代码
May 22 Javascript
ES6中定义类和对象的方法示例
Jul 31 Javascript
Ant Design Vue 添加区分中英文的长度校验功能
Jan 21 Javascript
js实现表格数据搜索
Aug 09 Javascript
解决layer弹出层的内容页点击按钮跳转到新的页面问题
Sep 14 #Javascript
layui自己添加图片按钮并点击跳转页面的例子
Sep 14 #Javascript
vue登录注册实例详解
Sep 14 #Javascript
javascript合并两个数组最简单的实现方法
Sep 14 #Javascript
VUE项目中加载已保存的笔记实例方法
Sep 14 #Javascript
Layui表格行工具事件与数据回填方法
Sep 13 #Javascript
layui使用表格渲染获取行数据的例子
Sep 13 #Javascript
You might like
php 获取本地IP代码
2013/06/23 PHP
ThinkPHP3.2.2的插件控制器功能
2015/03/05 PHP
laravel框架路由分组,中间件,命名空间,子域名,路由前缀实例分析
2020/02/18 PHP
JavaScript Prototype对象
2009/01/07 Javascript
Fastest way to build an HTML string(拼装html字符串的最快方法)
2011/08/20 Javascript
iframe窗口高度自适应的实现方法
2014/01/08 Javascript
JavaScript sub方法入门实例(把字符串显示为下标)
2014/10/17 Javascript
js判断手机访问或者PC的几个例子(常用于手机跳转)
2015/12/15 Javascript
三种Node.js写文件的方式
2016/03/08 Javascript
每日十条JavaScript经验技巧(二)
2016/06/23 Javascript
bootstrap modal+gridview实现弹出框效果
2017/08/15 Javascript
vue实现模态框的通用写法推荐
2018/02/26 Javascript
angular中子控制器向父控制器传值的实例
2018/10/08 Javascript
微信小程序 (地址选择1)--选取搜索地点并显示效果
2019/12/17 Javascript
[04:54]DOTA2 2017国际邀请赛:上届冠军WINGS采访短片
2017/08/09 DOTA
浅析Python中的join()方法的使用
2015/05/19 Python
使用Python从有道词典网页获取单词翻译
2016/07/03 Python
Python实现调度算法代码详解
2017/12/01 Python
python微信公众号开发简单流程
2018/03/23 Python
python生成九宫格图片
2018/11/19 Python
python将时分秒转换成秒的实例
2019/12/07 Python
如何在keras中添加自己的优化器(如adam等)
2020/06/19 Python
python/golang实现循环链表的示例代码
2020/09/14 Python
关于python中导入文件到list的问题
2020/10/31 Python
Python+Opencv实现把图片、视频互转的示例
2020/12/17 Python
Python自动化测试基础必备知识点总结
2021/02/07 Python
Html5 页面适配iPhoneX(就是那么简单)
2019/09/05 HTML / CSS
毕业生在校学习的自我评价分享
2013/10/08 职场文书
大学生就业求职信
2014/06/12 职场文书
常务副县长“三严三实”对照检查材料思想汇报
2014/10/05 职场文书
法院个人总结
2015/03/03 职场文书
幼儿园2015年度工作总结
2015/04/01 职场文书
2016大学先进团支部事迹材料
2016/03/01 职场文书
Python使用random模块实现掷骰子游戏的示例代码
2021/04/29 Python
Win11无法访问设备和打印机 如何解决页面空白
2022/04/09 数码科技
笔记本自带的win11如何跳过联网激活?
2022/04/20 数码科技