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 FATAL ERROR: CALL TO UNDEFINED FUNCTION BCMUL()解决办法
May 04 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(七)
Jun 23 PHP
ThinkPHP页面跳转success与error方法概述
Jun 25 PHP
php中实现精确设置session过期时间的方法
Jul 17 PHP
PHP @ at 记号的作用示例介绍
Oct 10 PHP
php使用unset()删除数组中某个单元(键)的方法
Feb 17 PHP
php获取当前页面完整URL地址
Dec 30 PHP
yii2使用ajax返回json的实现方法
May 14 PHP
Laravel框架实现model层的增删改查(CURD)操作示例
May 12 PHP
PHP实现正则匹配所有括号中的内容
Jun 22 PHP
PHP基于session.upload_progress 实现文件上传进度显示功能详解
Aug 09 PHP
php 比较获取两个数组相同和不同元素的例子(交集和差集)
Oct 18 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
一个简单的自动发送邮件系统(一)
2006/10/09 PHP
用PHP实现递归循环每一个目录
2010/08/08 PHP
如何在PHP中使用正则表达式进行查找替换
2013/06/13 PHP
如何使用Gitblog和Markdown建自己的博客
2015/07/31 PHP
老生常谈php 正则中的i,m,s,x,e分别表示什么
2017/03/02 PHP
js设置cookie过期当前时间减去一秒相当于立即过期
2014/09/04 Javascript
springMVC结合AjaxForm上传文件
2016/07/12 Javascript
基于JS实现发送短信验证码后的倒计时功能(无视页面刷新,页面关闭不进行倒计时功能)
2016/09/02 Javascript
js+div+css下拉导航菜单完整代码分享
2016/12/28 Javascript
Bootstarp基本模版学习教程
2017/02/01 Javascript
JS实现禁止高频率连续点击的方法【基于ES6语法】
2017/04/25 Javascript
详解使用webpack打包编写一个vue-toast插件
2017/11/08 Javascript
vue.js图片转Base64上传图片并预览的实现方法
2018/08/02 Javascript
用POSTMAN发送JSON格式的POST请求示例
2018/09/04 Javascript
Angularjs Ng_repeat中实现复选框选中并显示不同的样式方法
2018/09/12 Javascript
在VUE style中使用data中的变量的方法
2020/06/19 Javascript
详解Python发送邮件实例
2016/01/10 Python
Python实现字符串与数组相互转换功能示例
2017/09/22 Python
Python中矩阵库Numpy基本操作详解
2017/11/21 Python
tensorflow 使用flags定义命令行参数的方法
2018/04/23 Python
Python3.x爬虫下载网页图片的实例讲解
2018/05/22 Python
python 实现A*算法的示例代码
2018/08/13 Python
python 拼接文件路径的方法
2018/10/23 Python
Django unittest 设置跳过某些case的方法
2018/12/26 Python
解决yum对python依赖版本问题
2019/07/05 Python
python UDP(udp)协议发送和接收的实例
2019/07/22 Python
python实现电子书翻页小程序
2019/07/23 Python
python 五子棋如何获得鼠标点击坐标
2019/11/04 Python
假日旅行社实习自我鉴定
2013/09/24 职场文书
希特勒的演讲稿
2014/05/23 职场文书
幼儿园迎国庆65周年活动策划方案
2014/09/16 职场文书
简单的辞职信怎么写
2015/02/28 职场文书
2015年安康杯竞赛活动总结
2015/03/26 职场文书
学校团代会开幕词
2016/03/04 职场文书
解决python绘图使用subplots出现标题重叠的问题
2021/04/30 Python
JS函数式编程实现XDM一
2022/06/16 Javascript