自己写的提取文章中的图片(layui+tp5),以弹出窗口的形式,左右滑动展示,当然这里没用到tp5

//需要引用layer或者layui
//需要引用jquery
//需要引用swiper组件

<script>

//articlecontent是文章id所在DOM
      $("#aritclecontent").find("img").on("click",function() {

        var html = '';
        html += '<div class="swiper-container" style="z-index:999999999;width:1024px;"><div class="swiper-wrapper">';
        $('#aritclecontent img').each(function (index) {
            html += '<div class="swiper-slide">'
            html += '<div class="swiper-button-prev"></div><div class="swiper-button-next"></div><img style="width:1024px;" src="' + $(this).attr("src") + '"></div>';
        })
        html += '</div></div>';
        layer.open({
            type: 1,
            // area:['900px','600px'],
            title: false,
            skin: 'layui-layer-rim',
            closeBtn: 1,
            // shade:0,
            content: html
        })
        var mySwiper = new Swiper('.swiper-container',{
            // direction: 'vertical',//竖着切换
            navigation: {
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },
        })
    })
</script>

jquery中的this和$(this)分别,简单就是说,this是js中的,$(this)是jquery中的,当然jquery中也可以用this.

首先来看看JQuery中的 $() 这个符号，实际上这个符号在JQuery中相当于JQuery（）,即$(this)=jquery();也就是说，这样可以返回一个jquery对象。那么，当你在网页中alert($(‘#id’));时，会弹出一个[object Object ]，这个object对象，也就是jquery对象了。

那么，我们再回过头来说$(this)，这个this是什么呢？假设我们有如下的代码：

继续阅读 →

php分页

仔细研究了分页,算不上难点,但是也算不上简单,尤其是跟layui结合的时候

关注几点:

php方面,定义变量四个
$totalpage—总页数

$pagesize—每页显示多少条记录

$vpage—–url传过来的页码

$totallist—-总条数

ceil()函数,获取totalpage

继续阅读 →

h3c设备巡检命令列表

screen-length disable

display version

display snmp-agent sys-info version

display interface brief

display brief interface
display user-interface

继续阅读 →

ceil函数php

ceil(number);ceil函数向上舍入为最接近的整数,我用于分页.

<!DOCTYPE html>
<html>
<body>

<?php
echo(ceil(0.60) . “ ”); //1
echo(ceil(0.40) . “ ”); //1
echo(ceil(5) . “ ”); //5
echo(ceil(5.1) . “ ”); //6
echo(ceil(-5.1) . “ ”); //-5
echo(ceil(-5.9)); //-5
?>

</body>
</html>

util.event

layui.util的event方法示例

<button class="lay-btn" lay-active='e1'>事件点击1</button>
<button class="lay-btn" lay-active='e2'>事件点击2</button>
<button class="lay-btn" lay-active='e3'>事件点击3</button>
<script>
    layui.use('util',function(){
    var util = layui.util;

    util.event('lay-active',{
        e1:function(x){
            alert('11111111');
        }
        e2:function(x){
            alert('2222222');
        }
        e3:function(x){
            alert('333333');
        }
    })
</script>


上面的lay-active可以写成任意,只要和下面的util.event('lay-active',function(){})一致就行.

layui.js位置问题导致出错

layui GET xxx net::ERR_ABORTED 404 (Not Found) 错误

js/css/modules/laydate/default/laydate.css net::ERR_ABORTED 404 (Not Found)

layui.all.js:2 GET http://localhost/gisapi/view/lib/css/modules/laydate/default/laydate.css?v=5.0.9 net::ERR_ABORTED 404 (Not Found)
layui.all.js:2 GET http://localhost/gisapi/view/lib/css/modules/layer/default/layer.css?v=3.1.1 net::ERR_ABORTED 404 (Not Found)
layui.all.js:2 GET http://localhost/gisapi/view/lib/css/modules/code.css net::ERR_ABORTED 404 (Not Found)

继续阅读 →

tp5分页样式,直接在模板文件中写入即可,记得加

$page添加自定义样式


/*分页样式*/
.pagination{
	width:100%;
	padding:15px 0;
	height:32px;
	margin-left: auto;
	margin-right: auto;
}
.pagination li{
	float:left;
	width:30px;
	height:30px;
	margin-left: 3px;
	border:1px solid #fb2a2a;
	text-align: center;
	line-height: 30px;
	
}
.pagination li a{
	color:#fb2a2a;
	display:block;
}
.pagination li span{
	color:#fb2a2a;
}
.pagination .active{
	background: #fb2a2a;
	color:#fff;
}
.pagination .active span{
	color:#fff;
}