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 相关文章推荐
用PHP4访问Oracle815
Oct 09 PHP
基于php权限分配的实现代码
Apr 28 PHP
php cli 小技巧
Jun 03 PHP
如何设置mysql允许外网访问
Jun 04 PHP
php对称加密算法示例
May 07 PHP
php实现无限级分类(递归方法)
Aug 06 PHP
php生成mysql的数据字典
Jul 07 PHP
PHP页面跳转实现延时跳转的方法
Dec 10 PHP
TP3.2批量上传文件或图片 同名冲突问题的解决方法
Aug 01 PHP
PHP CURL使用详解
Mar 21 PHP
laravel请求参数校验方法
Oct 10 PHP
PHP后门隐藏的一些技巧总结
Nov 04 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
Zend Framework教程之分发器Zend_Controller_Dispatcher用法详解
2016/03/07 PHP
CodeIgniter记录错误日志的方法全面总结
2016/05/17 PHP
php加密之discuz内容经典加密方式实例详解
2017/02/04 PHP
CI框架(CodeIgniter)实现的数据库增删改查操作总结
2018/05/23 PHP
Gambit vs CL BO3 第一场 2.13
2021/03/10 DOTA
关于Javascript 的 prototype问题。
2007/01/03 Javascript
jquery.ui.progressbar 中文文档
2009/11/26 Javascript
javascript+mapbar实现地图定位
2010/04/09 Javascript
15条JavaScript最佳实践小结
2013/08/09 Javascript
javascript 函数声明与函数表达式的区别介绍
2013/10/05 Javascript
使表格的标题列可左右拉伸jquery插件封装
2014/11/24 Javascript
jQuery中[attribute*=value]选择器用法实例
2014/12/31 Javascript
学习javascript的闭包,原型,和匿名函数之旅
2015/10/18 Javascript
详解AngularJS 模态对话框
2016/04/07 Javascript
AngularJS  双向数据绑定详解简单实例
2016/10/20 Javascript
基于JS组件实现拖动滑块验证功能(代码分享)
2016/11/18 Javascript
jQuery实现弹幕效果
2017/02/17 Javascript
Bootstrap Table使用整理(二)
2017/06/09 Javascript
ES6 fetch函数与后台交互实现
2018/11/14 Javascript
回顾Javascript React基础
2019/06/15 Javascript
JS 5种遍历对象的方式
2020/06/16 Javascript
由浅入深讲解python中的yield与generator
2017/04/05 Python
pygame游戏之旅 游戏中添加显示文字
2018/11/20 Python
使用python判断你是青少年还是老年人
2018/11/29 Python
pytorch查看通道数 维数 尺寸大小方式
2020/05/26 Python
UGG澳洲官网:UGG Australia
2018/04/26 全球购物
入党积极分子学习两会心得体会范文
2014/03/17 职场文书
统计学教授推荐信
2014/09/18 职场文书
法人单位适用的授权委托书
2014/09/19 职场文书
专升本学生毕业自我鉴定
2014/10/04 职场文书
安全教育观后感
2015/06/17 职场文书
2015教师个人师德工作总结
2015/10/23 职场文书
JavaScript 防篡改对象的用法示例
2021/04/24 Javascript
给numpy.array增加维度的超简单方法
2021/06/02 Python
Spring Security使用单点登录的权限功能
2022/04/03 Java/Android
Java中的Kafka为什么性能这么快及4大核心详析
2022/09/23 Java/Android