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实现MVC开发得最简单的方法――模型
Apr 10 PHP
PHP 加密与解密的斗争
Apr 17 PHP
php带密码功能并下载远程文件保存本地指定目录 修改加强版
May 16 PHP
基于PHP一些十分严重的缺陷详解
Jun 03 PHP
php生成随机字符串可指定纯数字、纯字母或者混合的
Apr 18 PHP
php使用GD创建保持宽高比缩略图的方法
Apr 17 PHP
PHP Cookei记录用户历史浏览信息的代码
Feb 03 PHP
CI框架实现cookie登陆的方法详解
May 18 PHP
PHP+Ajax验证码验证用户登录
Jul 20 PHP
Thinkphp结合ajaxFileUpload实现异步图片传输示例
Mar 13 PHP
彻底搞懂PHP 变量结构体
Oct 11 PHP
PHP中strtr与str_replace函数运行性能简单测试示例
Jun 22 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
采用header定义为文件然后readfile下载(隐藏下载地址)
2014/01/31 PHP
php实现加减法验证码代码
2014/02/14 PHP
WIFI万能钥匙密码查询接口实例
2015/09/28 PHP
详解PHP的Laravel框架中Eloquent对象关系映射使用
2016/02/26 PHP
JavaScript的目的分析
2007/01/05 Javascript
初学JavaScript第二章
2008/09/30 Javascript
js下获取div中的数据的原理分析
2010/04/07 Javascript
javascript 折半查找字符在数组中的位置(有序列表)
2010/12/09 Javascript
JavaScript面向对象程序设计三 原型模式(上)
2011/12/21 Javascript
Jquery实现的角色左右选择特效
2014/05/21 Javascript
jQuery异步加载数据并添加事件示例
2014/08/24 Javascript
js实现按钮加背景图片常用方法
2014/11/01 Javascript
JavaScript iframe数据共享接口实现方法
2016/01/06 Javascript
Bootstrap Validator 表单验证
2016/07/25 Javascript
EasyUI 结合JS导出Excel文件的实现方法
2016/11/10 Javascript
基于jQuery实现定位导航位置效果
2017/11/15 jQuery
vue将时间戳转换成自定义时间格式的方法
2018/03/02 Javascript
JavaScript模拟实现自由落体效果
2018/08/28 Javascript
微信小程序 扭蛋抽奖机css3动画实现详解
2019/07/19 Javascript
探究数组排序提升Python程序的循环的运行效率的原因
2015/04/01 Python
在Python中操作时间之tzset()方法的使用教程
2015/05/22 Python
python递归打印某个目录的内容(实例讲解)
2017/08/30 Python
Python 类的特殊成员解析
2018/06/20 Python
Python箱型图绘制与特征值获取过程解析
2019/10/22 Python
git查看、创建、删除、本地、远程分支方法详解
2020/02/18 Python
Python 基于FIR实现Hilbert滤波器求信号包络详解
2020/02/26 Python
Python使用xpath实现图片爬取
2020/09/16 Python
英国在线发型和美容产品商店:Beauty Cutie
2019/04/27 全球购物
意大利消费电子产品购物网站:SLG Store
2019/12/26 全球购物
车间调度岗位职责
2013/11/30 职场文书
汽车促销活动方案
2014/03/31 职场文书
学校法制宣传月活动总结
2014/07/03 职场文书
优秀本科毕业生自荐信
2014/07/04 职场文书
原料仓仓管员岗位职责
2014/07/08 职场文书
python 机器学习的标准化、归一化、正则化、离散化和白化
2021/04/16 Python
通过T-SQL语句创建游标与实现数据库加解密功能
2022/03/16 SQL Server