thinkPHP框架中layer.js的封装与使用方法示例


Posted in PHP onJanuary 18, 2019

本文实例讲述了thinkPHP框架中layer.js的封装与使用方法。分享给大家供大家参考,具体如下:

v层:(还没实现功能的)

<!DOCTYPE html>
<html lang="zh-cn">
<head>
  <meta charset="UTF-8">
  <title>添加</title>
</head>
<body>
  <form action="{:url('save')}" method="post">
    <label for="name">教室名称:</label><input type="text" name="name" id="name" />
    <label for="teacher">teacher:</label>
    <select name="teacher_id" id="teacher">
    {volist name="teacher" id="teacher"}
      <option value="{$teacher->getData('id')}">{$teacher->getData('name')}</option>
    {/volist}
    </select>
    <button type="button" id="submit">submit</button>
  </form>
</body>
<script src="/static/js/jquery2.1.js"></script>
<script src="/static/js/dialog/layer.js"></script>
<script src="/static/js/dialog.js"></script>
<script>
  $(document).ready(function () {
   $('#submit').click(function () {
     return dialog.success(1,"jajaj");
   })
  })
</script>
</html>

首先把弹窗必要的硬件  src 进去:

其中

<script src="/static/js/dialog/layer.js"></script>

这个是一个文件包, dialog 文件包里面装了layer的部件,比如图片之类的我们引用layer这个文件就好了

<script src="/static/js/dialog.js"></script>

dialog.js是自定义的

var dialog = {
  // 错误弹出层
  error: function(message) {
    layer.open({
      content:message,
      icon:2,
      title : '错误提示',
    });
  },
  //成功弹出层
  success : function(message,url) {
    layer.open({
      content : message,
      icon : 1,
      yes : function(){
        location.href=url;
      },
    });
  },
  // 确认弹出层
  confirm : function(message, url) {
    layer.open({
      content : message,
      icon:3,
      btn : ['是','否'],
      yes : function(){
        location.href=url;
      },
    });
  },
  //无需跳转到指定页面的确认弹出层
  toconfirm : function(message) {
    layer.open({
      content : message,
      icon:3,
      btn : ['确定'],
    });
  },
}

先让他跑起来:

<script>
  $(document).ready(function () {
   $('#submit').click(function () {
     return dialog.success(1,"jajaj");
   })
  })
</script>

thinkPHP框架中layer.js的封装与使用方法示例

第一部分完成

thinkphp  中使用:

在thinkphp   Common创建一个function.php 公用函数,在里面定义:

function show($status,$message,$data=array()){
  $reuslt = array(
    'status' => $status,
    'message' => $message,
    'data' => $data,
  );
  exit(json_encode($reuslt));
}

在controller层直接引用这个函数就可以了

比如:

if(1==0){
   return show(0,'成功',jump_url);
}else{
    return show(1,'错误',jump_url);
}

是这样子的,朋友。

利用这个做 ajax 请求:

定义:

var url = admin.php?cosndf&....
var jump_url ;www.baidu.com //跳转的页面
$.post(url,postData,function(result){
    if(result.status == 1) {
      //成功
      return dialog.success(result.message,jump_url);
    }else if(result.status == 0) {
      // 失败
      return dialog.error(result.message);
    }
  },"JSON");  //这个不要漏了

希望本文所述对大家基于ThinkPHP框架的PHP程序设计有所帮助。

PHP 相关文章推荐
php 购物车实例(申精)
May 11 PHP
关于PHP模板Smarty的初级使用方法以及心得分享
Jun 21 PHP
解析php中curl_multi的应用
Jul 17 PHP
php使用curl获取https请求的方法
Feb 11 PHP
php动态添加url查询参数的方法
Apr 14 PHP
Thinkphp3.2.3整合phpqrcode生成带logo的二维码
Jul 21 PHP
swoole和websocket简单聊天室开发
Nov 18 PHP
PHP学习笔记之session
May 06 PHP
CI框架实现创建自定义类库的方法
Dec 25 PHP
Laravel 不同生产环境服务器的判断实践
Oct 15 PHP
PhpStorm 如何优雅的调试Hyperf的方法步骤
Nov 24 PHP
PHP xpath提取网页数据内容代码解析
Jul 16 PHP
PHP内置函数生成随机数实例
Jan 18 #PHP
Laravel框架基于中间件实现禁止未登录用户访问页面功能示例
Jan 17 #PHP
Laravel框架基于ajax实现二级联动功能示例
Jan 17 #PHP
Laravel框架基于ajax和layer.js实现无刷新删除功能示例
Jan 17 #PHP
strpos() 函数判断字符串中是否包含某字符串的方法
Jan 16 #PHP
Laravel框架实现的批量删除功能示例
Jan 16 #PHP
Laravel框架实现的rbac权限管理操作示例
Jan 16 #PHP
You might like
用PHP实现文件上传二法
2006/10/09 PHP
中英文字符串翻转函数
2008/12/09 PHP
微信支付开发教程(一)微信支付URL配置
2014/05/28 PHP
javascript编程起步(第七课)
2007/01/10 Javascript
jQuery 隔行换色 支持键盘上下键,按Enter选定值
2009/08/02 Javascript
ExtJS的FieldSet的column列布局
2009/11/20 Javascript
js面向对象设计用{}好还是function(){}好(构造函数)
2011/10/23 Javascript
删除select中所有option选项jquery代码
2013/08/12 Javascript
遍历DOM对象内的元素属性示例代码
2014/02/08 Javascript
使用时间戳解决ie缓存的问题
2014/08/20 Javascript
js propertychange和oninput事件
2014/09/28 Javascript
js实现的简洁网页滑动tab菜单效果代码
2015/08/24 Javascript
学习Bootstrap滚动监听 附调用方法
2016/07/02 Javascript
关于javascript中限定时间内防止按钮重复点击的思路详解
2016/08/16 Javascript
微信小程序 前端源码逻辑和工作流详解
2016/10/08 Javascript
QQ跳转支付宝并自动领红包脚本(最新)
2018/06/22 Javascript
实例分析vue循环列表动态数据的处理方法
2018/09/28 Javascript
vue tab切换,解决echartst图表宽度只有100px的问题
2020/07/19 Javascript
[03:06]2018年度CS GO最具人气解说-完美盛典
2018/12/16 DOTA
在windows系统中实现python3安装lxml
2016/03/23 Python
django+mysql的使用示例
2018/11/23 Python
Python基于datetime或time模块分别获取当前时间戳的方法实例
2019/02/19 Python
Django框架models使用group by详解
2020/03/11 Python
Python+Opencv实现把图片、视频互转的示例
2020/12/17 Python
[原创]赚疯了!转手立赚800+?大佬的python「抢茅台脚本」使用教程
2021/01/12 Python
鞋子女王塔玛拉·梅隆同名奢侈品牌:Tamara Mellon
2017/11/22 全球购物
Lululemon加拿大官网:加拿大知名体育服装零售商
2019/04/12 全球购物
Intersport西班牙:在线体育商店
2019/11/06 全球购物
生产主管岗位职责
2013/11/10 职场文书
大学生求职信范文应怎么写
2014/01/01 职场文书
迟到检讨书400字
2014/01/13 职场文书
新闻编辑求职信
2014/04/09 职场文书
分家协议书
2014/04/21 职场文书
会计继续教育培训心得体会
2016/01/19 职场文书
Python 多线程之threading 模块的使用
2021/04/14 Python
浅谈Python数学建模之整数规划
2021/06/23 Python