最新评论 - 第 47 页

广西南宁市 2017-11-01 18:21

#0

阅读 56.6万

Windows环境安装PHP redis扩展

windows php_redis.dll 官方下载地址 php5x php7x

官方php_redis.dll
http://windows.php.net/downloads/pecl/releases/redis/2.2.7/

官方 linux版本的
https://pecl.php.net/package/redis

官方 php_memcache.dll
http://windows.php.net/downloads/pecl/releases/memcache/3.0.8/

更多
http://windows.php.net/downloads/pecl/

PHP7.1 php_redis.dll 
下载地址：http://windows.php.net/downloads/pecl/releases/redis/3.1.2/

查看文章跳到评论

广西南宁市 2017-11-01 17:04

#0

阅读 45.7万

理解JavaScript构造函数

认识js函数对象（Function Object）

认识函数对象（Function Object）
可以用function关键字定义一个函数，对于每个函数可以为其指定一个函数名，通过函
数名来进行调用。这些都是代码给用户的印象，而在JavaScript解释执行的时候，实际上每
个函数都是被维护为一个对象，这就是本小节将要介绍的函数对象（Function Object）。
函数对象与其它用户所定义的对象有着本质的区别，这一类对象被称之为内部对象，例
如日期对象（Date）、数组对象（Array）、字符串对象（String）都是属于内部对象。换句话
说，这些内置对象的构造器是由JavaScript本身所定义的：通过执行new Array()这样的语句
返回一个对象，JavaScript 内部有一套机制来初始化返回的对象，而不是由用户来指定对象
的构造方式。
在 JavaScript中，函数对象对应的类型是Function，正如数组对象对应的类型是Array，
日期对象对应的类型是Date一样，可以通过new Function()来创建一个函数对象，也可以通
过function关键字来创建一个对象。为了便于理解，将函数对象的创建和数组对象的创建来
比较。先看数组对象：下面两行代码的作用是一样的，都是创建一个数组对象myArray：
var myArray=[];
//等价于
var myArray=new Array();
同样，下面的两段代码也是等价的，都是创建一个函数myFunction：
function myFunction(a,b){
return a+b;
}
//等价于
var myFunction=new Function("a","b","return a+b");
现在上面的代码还有些难以理解，但是通过和构造数组对象语句的比较，可以清楚的看
到函数的对象本质，前面介绍的函数声明是上述代码的第一种方式，而在解释器内部，当遇
到这种语法时，就会自动构造一个Function 对象，将函数作为一个内部的对象来存储和运
行。从这里也可以看到，一个函数对象名称（函数变量）和一个普通变量名称具有同样的规
范，都可以通过变量名来引用这个变量，但是函数变量名后面可以跟上括号和参数列表来进
行函数调用。
也许不会有人通过new Function()的形式来创建一个函数，因为一个函数体通常会有多
条语句，如果将它们以一个字符串的形式作为参数传递，那么代码的可读性会非常的差。下
面介绍一下其使用语法：
var funcName=new Function(p1,p2,...,pn,body);
参数的类型都是字符串，p1 到pn表示所创建函数的参数名称列表，body表示所创建函
数的函数体语句，而funcName就是所创建函数的名称了。可以不指定任何参数创建一个空
函数，不指定funcName创建一个无名函数，当然那样的函数什么用处都没有。
需要注意的是，前面说p1 到pn是参数名称的列表，这意味着p1不仅仅只能代表一个
参数，它也可以是一个逗号格开的参数列表，例如下面的定义是等价的：
new Function("a", "b", "c", "return a+b+c")
new Function("a, b, c", "return a+b+c")
new Function("a,b", "c", "return a+b+c")
JavaScript引入Function类型并提供new Function()这样的语法来创建函数并不是毫无意
义的，在后面可以看到，函数作为一个对象，它本身就可以具有一些方法和属性，而为函数
对象添加属性和方法就必须借助于Function这个类型。
现在已经认识到了函数的本质，它其实是一个内部对象，由JavaScript解释器决定其运
行方式。通过上述代码创建的函数，在程序中可以使用函数名进行调用。于是在本节开头列
出的函数定义问题也得到了解释：它们都是创建函数对象的正确语法。注意直接在函数声明
后面加上括号就表示创建完成后立即进行函数调用，例如：
var i=function (a,b){
return a+b;
}(1,2);
alert(i);
这段代码会显示变量i 的值等于3。i 是表示返回的值，而不是创建的函数，因为括号
“(”比等号“=”有更高的优先级。这样的代码可能并不常用，但当用户想在很长的代码段
中进行模块化设计或者想避免命名冲突，这是一个不错的解决办法。
需要注意的是，尽管下面两种创建函数的方法是等价的：
function funcName(){
//函数体
}
//等价于
var funcName=function(){
//函数体
}
但前面一种方式创建的是有名函数，而后面是创建了一个无名函数，只是让一个变量指
向了这个无名函数。在使用上仅有一点区别，就是：对于有名函数，它可以出现在调用之后
再定义；而对于无名函数，它必须是在调用之前就已经定义。例如：
<script language="JavaScript" type="text/javascript">
<!--
func();
var func=function(){
alert(1)
}
//-->
</script>
这段语句将产生func未定义的错误，而：
<script language="JavaScript" type="text/javascript">
<!--
func();
function func(){
alert(1)
}
//-->
</script>
则能够正确执行，甚至下面的语句也能正确执行：
<script language="JavaScript" type="text/javascript">
<!--
func();
var someFunc=function func(){
alert(1)
}
//-->
</script>
由此可见，尽管JavaScript是一门解释型的语言，但它会在进行函数调用时，检查整个
代码中是否存在相应的函数定义，这个函数名只有是通过function funcName()形式定义的才
会有效，而不能是匿名函数。

查看文章跳到评论

广西南宁市 2017-11-01 16:50

#0

阅读 45.7万

理解JavaScript构造函数

js深入理解构造函数和原型对象

1.在典型的oop的语言中，如java,都存在类的概念，类就是对象的模板，对象就是类的实例。但在js中不存在类的概念，js不是基于类，而是通过构造函数(constructor)和原型链（propotype chains）实现的。但在ES6中引入了类（class）这个概念，作为对象的模板，新的class写法知识让原型对象的写法更加清晰，这里不重点谈这个

2.首先我们来详细了解下什么是构造器

构造函数的特点：

a:构造函数的首字母必须大写，用来区分于普通函数

b:内部使用的this对象，来指向即将要生成的实例对象

c:使用New来生成实例对象

eg1:

function Person(name,age){
     this.name = name;    
     this.age = age;   
     this.sayHello = function(){   
         console.log(this.name +"say hello");
    }
}

var boy = new Person("bella",23);    
boy.sayHello(); // bella say hello

构造函数的缺点：

所有的实例对象都可以继承构造器函数中的属性和方法。但是，同一个对象实例之间，无法共享属性

解决思路：

a:所有实例都会通过原型链引用到prototype

b:prototype相当于特定类型所有实例都可以访问到的一个公共容器

c:那么我们就将重复的东西放到公共容易就好了

eg2:

function Person(name,age){
    this.name = name;
    this.age = age;
    this.sayHello = function(){
        console.log(this.name + "say hello");
    }
}
var girl = new Person("bella",23);
var boy = new Person("alex",23);
console.log(girl.name);  //bella
console.log(boy.name);   //alex
console.log(girl.sayHello === boy.sayHello);  //false

一个构造函数Person生成了两个对象实例girl和boy,并且有两个属性和一个方法。但是sayHello方法是不一样的。如上图（图画得很丑）。也就是说当New一个实例对象的时候，都会去创建一个sayHello方法，这就浪费了内存资源，因为sayHello方法使一样的行为的，完全可以被两个实例对象共享。

所以，缺点就是：同一个构造函数的对象实例之间无法共享属性和方法。

为了解决构造函数的这个缺点，js提供了prototype属相来解决该问题。

propotype属性的作用

js中每个数据类型都是对象，除了null 和 undefined（这个可以参考另一篇将null 和 undefined的博客）,而每个对象都是继承自一个原型对象，只有null除外，它没有自己的原型对象，最终的Object的原型为null

eg3:

function Person(name,age){
    this.name = name;
    this.age = age;
}
Person.propotype.sayHello = function(){
    console.log(this.name + "say hello");
}
var girl = new Person("bella",23);
var boy = new Person("alex",23);
console.log(girl.name);  //bella
console.log(boy.name);   //alex
console.log(girl.sayHello === boy.sayHello);  //true

function Person(name,age){
    this.name = name;
    this.age = age;
}
Person.propotype.sayHello = function(){
    console.log(this.name + "say hello");
}
var girl = new Person("bella",23);
console.log(girl.construcotr); //Person()
console.log(girl.construcotr == Person.propotype.construcotr); //true

constructor属性的作用

a:分辨原型对象到底是哪个构造函数

 function Person(){};
 var person1 = new Person();
 console.log(person1.construcotr === Person); //true

b:从实例新建另一个实例

 function Person(){};
 var person1 = new Person();
 var person2 = new person1.construcotr();
 console.log(person2 instanceof Person); //true

c:由于constructor属性是一种原型对象和构造函数的关系，所以在修改原型对象的时候，一定要注意construtor的指向问题，避免instanceof失真，关于这一点，会在继承中讲到。

3.了解了构造器，我们来看下原型prototype

JS中万物都是对象，但是对象也分为：普通对象和函数对象，也就是Object 和 Function.

那么怎么区分普通对象和函数对象呢？ ---凡是通过New Function()创建的对象都是函数对象，其他的都是普通对象.

需要注意的是：普通对象没有propotype（prototype即是属性也是对象），但是有__proto__属性。

js创建对象的时候都有一个__propo__内置属性，用于指向创建它的函数对象的原型对象prototype。

我们还是来根据eg3的代码来分析原型链

console.log(girl.__proto__ === Person.protype);//true

console.log(Persion.propotype.__proto__ === Object.propotype);//true

console.log(Object.porpotype.__proto__); //null

通过__proto__串起来直到Object.propotype.__proto__为null的链叫做原型链(矩形表示函数对象，椭圆形表示普通对象)

也许看到这个图会有几个疑问

a:为什么Object.__proto__指向Function.prototype?

Object是函数对象，是通过new Function()创建的，所以...

b:Function.__proto__ === Function.prototype //true

Function也是对象函数，通过new Function()创建，所以...

查看文章跳到评论

广西南宁市 2017-11-01 16:46

#0

阅读 68.5万

理解box-sizing布局

后者可以这么说
content-box：标准盒模型，CSS定义的宽高只包含content的宽高
border-box：IE盒模型，CSS定义的宽高包括了content，padding和border

广西南宁市2017-11-01 16:46:35

为什么只是 border和padding，给设置margin为什么还是会溢出呢？

查看文章跳到评论

广西南宁市 2017-11-01 16:29

#0

阅读 45.7万

理解JavaScript构造函数

function myObject(msg){
}
myObject.name='china';
myObject.nameThis='china';
alert(myObject.name); //IE: china FF:myObject
alert(myObject.nameThis); //IE,FF: china

广西南宁市2017-11-01 16:29:20

好像name是FF的关键字，在IE下可以，但是在FF下换个名字也可以

查看文章跳到评论

广西南宁市 2017-11-01 16:27

#0

阅读 45.7万

理解JavaScript构造函数

当我们试图访问实例对象的属性或方法时，如果该属性或方法在此实例对象上，那么就去原型链上查找，如果原型链上没有，会再向上一级原型链上查找。
这是基于原型链实现继承中对属性和方法的访问，例子如下：

var Person=function(){};
//将函数原型的属性重写为stu和sayHello。
Person.prototype={
Stu:{Name:"Bill"},
sayHello:function(){
alert("Hello,I'm "+this.Stu.Name)
}
}
//实例化
var p1=new Person();
//实例本身没有sayHello方法，所以调用了原型链上的sayHello方法。
p1.sayHello();//Hello.I'm Bill

但当我们修改实例对象的属性和方法时，如果此对象的该属性或方法不存在，那么会在该对象上创建该属性，而不是修改原型链上的属性，例子如下：

//实例化p2
var p2=new Person();
p2.Stu = "student";
alert(p1.Stu); //[Object object] 实例p1依然访问原型链上的Stu属性，并且原型链上的Stu属性并未被p2.Stu = "student"所影响。
alert(p2.Stu);//student 实例p2访问的Stu已经是自己的Stu属性了，p2.Stu = "student"使p2在自己的对象上创建了Stu属性。

//但是，有这样一种情况：
delete p2.Stu;//删除实例p2的Stu属性。
alert(p2.Stu);//[Object object] 说明p2自身的Stu属性已被删除，此时访问的已经是原型链上的Stu属性了。
//更改实例对象在原型链上的属性，如果按照前面的说法，p2可能会创建自己的Stu.Name属性并赋值为Martin。但实际情况是这样的，如果实例对象要修改自身的一级属性（p2.Stu = "xxx";），并且该属性不存在，那么，会在该实例对象上创建Stu属性，并修改该属性，此时，不会影响对原型链上的该属性造成影响。如果实例对象要修改自身的N(N>1)级属性（p2.Stu.Name = "xxx";），若该实例不存在N级前的N-1级中的某个属性，就会到原型链上查找该属性，若未找到，查找下一级原型链，如果到最后都没有找到，给出TypeError错误，如果找到了，那么就在该原型链上修改此属性，例子如下：
p2.Stu.Name="Martin";//自身不存在Stu属性，访问原型链，原型链上存在，修改该原型链上的该属性，当然，这里只是一级原型链，也可能是二级或者N级。
p1.sayHello();//Martin 说明原型链已被修改
p2.sayHello();//Martin 说明原型链已被修改
p2.Teacher.Name = "jack";// TypeError: Cannot set property 'Name' of undefined 实例和原型链上都不存在Teacher属性，无法赋值。

原因：
根据ECMA262-3 ，当对对象O（所有javascript对象和部分宿主对象）的属性P设置值时会调用内置的[[Put]]方法：
8.6.22[[Put]]方法描述：
1.以名字 P 调用 O 的[[CanPut]]方法。
2.如果 Result(1) 为 false，返回。
3.如果 O 没有以 P 为名的属性，转到步骤6.
4.将该属性的值设为 V 。不改变该属性的特征。
5.返回。
6.创建以 P 为名属性，将其值设为 V ，并给予它空特征。
7.返回。
不过，值得注意的是，假如 O 是一个 Array 对象，关于[[Put]]方法有更多详细叙述（15.4.5.1）。

8.6.2.3 [[CanPut]]方法执行步骤：
1.如果 O 没有以 P 命名的属性，转到步骤4.
2.如果该属性有 ReadOnly 特征，返回 false。
3.返回 true。
4.如果 O 的[[Prototype]]为 null，返回 true。
5.以属性名 P 调用 O 的[[Prototype]]的[[CanPut]]方法。
6.返回 Result(5)。

ECMA的解释印证了我们前面例子的现象。

查看文章跳到评论

广西南宁市 2017-11-01 15:58

#0

阅读 39万

JavaScript简写技巧

<script>
var a = 5;
(a > 0) ? (alert("这是正整数"),document.title="也是自然数") : alert("这是负数");
</script>

广西南宁市2017-11-01 15:58:39

语句用逗号可以分开了，就是不能出现return

广西南宁市2017-11-01 15:59:06

语句块是没有返回值的。。。另外分号表示语句结束
碰到这种情况你可以用小括号和逗号

广西南宁市2017-11-01 15:59:24

{} 花括号是创建对象字面量的符号,而对象是由若干个 "名/值"对组成的集合对象的属性名与属性值之间由冒号连接所以这里JS认为你要创建一个对象,可对象里又找不到冒号

广西南宁市2017-11-01 15:59:43

这玩意和大一学的C#的｛｝表示语句段的意思不一样，看来

查看文章跳到评论

广西南宁市 2017-11-01 15:51

#0

阅读 39万

JavaScript简写技巧

最后一点 ~~ 刚知道，那parseInt也可以用 ~~ 了。
就是if的时候要注意，比如

if (variable1 !== null || variable1 !== undefined || variable1 !== '') {
let variable2 = variable1;
}
const variable2 = variable1 || 'new';

要考虑variable1为0的时候，因为当0 的时候，上下两个语句是不一样的结果。

查看文章跳到评论

广西南宁市 2017-11-01 15:36

#0

阅读 2804.9万

常用html、demo代码

两个正方体旋转logo特效动画
立方体魔方中里面包含小正方体方块图标

<style>
.cube-wrapper[data-v-bc50a1ba] {
	width: 100%;
	position: relative;
	-webkit-transform: scale(.25);
	transform: scale(.25);
	height: 50px;
	z-index: -1
}

.cube-wrapper .cube[data-v-bc50a1ba],.cube-wrapper .cube li[data-v-bc50a1ba] {
	position: absolute;
	display: block
}

.cube-wrapper .cube[data-v-bc50a1ba] {
	width: 100%;
	height: 100%;
	padding: 0;
	-webkit-transform-origin: 50px 50px;
	transform-origin: 50px 50px;
	-webkit-transform: rotateX(-33.5deg) rotateY(45deg);
	transform: rotateX(-33.5deg) rotateY(45deg);
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-animation: slow-spin-data-v-bc50a1ba 3s linear infinite;
	animation: slow-spin-data-v-bc50a1ba 3s linear infinite;
	margin: -50px 0 0 -50px;
	top: 50%;
	left: 50%
}

.cube-wrapper .cube li[data-v-bc50a1ba] {
	width: 75pt;
	height: 75pt
}

.cube-wrapper .cube li[data-v-bc50a1ba]:after {
	content: "";
	display: block;
	position: absolute;
	width: 75pt;
	height: 75pt;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	background-color: rgba(33,150,243,.2)
}

.cube-wrapper .cube .back[data-v-bc50a1ba],.cube-wrapper .cube .front[data-v-bc50a1ba],.cube-wrapper .cube .left[data-v-bc50a1ba],.cube-wrapper .cube .right[data-v-bc50a1ba],.cube-wrapper .cube .top[data-v-bc50a1ba] {
	background: radial-gradient(transparent 30%,rgba(6,68,117,.2) 100%)
}

.cube-wrapper .cube .front[data-v-bc50a1ba] {
	-webkit-transform: translateZ(50px);
	transform: translateZ(50px)
}

.cube-wrapper .cube .back[data-v-bc50a1ba] {
	-webkit-transform: rotateX(-180deg) translateZ(50px);
	transform: rotateX(-180deg) translateZ(50px)
}

.cube-wrapper .cube .right[data-v-bc50a1ba] {
	-webkit-transform: rotateY(90deg) translateZ(50px);
	transform: rotateY(90deg) translateZ(50px)
}

.cube-wrapper .cube .left[data-v-bc50a1ba] {
	-webkit-transform: rotateY(-90deg) translateZ(50px);
	transform: rotateY(-90deg) translateZ(50px)
}

.cube-wrapper .cube .top[data-v-bc50a1ba] {
	-webkit-transform: rotateX(90deg) translateZ(50px);
	transform: rotateX(90deg) translateZ(50px)
}

.cube-wrapper .cube .top[data-v-bc50a1ba]:after {
	background-color: rgba(33,150,243,.2)
}

.cube-wrapper .cube .bottom[data-v-bc50a1ba] {
	-webkit-transform: rotateX(-90deg) translateZ(50px);
	transform: rotateX(-90deg) translateZ(50px)
}

.cube-wrapper .cube .floor[data-v-bc50a1ba] {
	box-shadow: -300px 0 50px rgba(0,0,0,.3);
	-webkit-backface-visibility: visible;
	backface-visibility: visible;
	width: 110px;
	height: 110px;
	left: 295px;
	background-color: transparent;
	-webkit-transform: rotateX(-90deg) translateZ(60px);
	transform: rotateX(-90deg) translateZ(60px)
}

.cube-wrapper .cube .floor[data-v-bc50a1ba]:after {
	display: none
}

.cube-wrapper .cube-inner[data-v-bc50a1ba],.cube-wrapper .cube-inner li[data-v-bc50a1ba] {
	position: absolute;
	display: block
}

.cube-wrapper .cube-inner[data-v-bc50a1ba] {
	width: 100%;
	height: 100%;
	padding: 0;
	top: 50%;
	left: 50%;
	-webkit-transform-origin: 25px 25px;
	transform-origin: 25px 25px;
	margin: -25px 0 0 -25px;
	-webkit-transform: rotateX(-33.5deg) rotateY(45deg);
	transform: rotateX(-33.5deg) rotateY(45deg);
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-animation: fast-spin-data-v-bc50a1ba 3s linear infinite;
	animation: fast-spin-data-v-bc50a1ba 3s linear infinite
}

.cube-wrapper .cube-inner li[data-v-bc50a1ba] {
	width: 50px;
	height: 50px
}

.cube-wrapper .cube-inner li[data-v-bc50a1ba]:after {
	content: "";
	display: block;
	position: absolute;
	width: 50px;
	height: 50px;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	background-color: rgba(0,0,0,.2)
}

.cube-wrapper .cube-inner .back[data-v-bc50a1ba],.cube-wrapper .cube-inner .front[data-v-bc50a1ba],.cube-wrapper .cube-inner .left[data-v-bc50a1ba],.cube-wrapper .cube-inner .right[data-v-bc50a1ba],.cube-wrapper .cube-inner .top[data-v-bc50a1ba] {
	background: radial-gradient(transparent 30%,rgba(0,0,0,.2) 100%)
}

.cube-wrapper .cube-inner .front[data-v-bc50a1ba] {
	-webkit-transform: translateZ(25px);
	transform: translateZ(25px)
}

.cube-wrapper .cube-inner .back[data-v-bc50a1ba] {
	-webkit-transform: rotateX(-180deg) translateZ(25px);
	transform: rotateX(-180deg) translateZ(25px)
}

.cube-wrapper .cube-inner .right[data-v-bc50a1ba] {
	-webkit-transform: rotateY(90deg) translateZ(25px);
	transform: rotateY(90deg) translateZ(25px)
}

.cube-wrapper .cube-inner .left[data-v-bc50a1ba] {
	-webkit-transform: rotateY(-90deg) translateZ(25px);
	transform: rotateY(-90deg) translateZ(25px)
}

.cube-wrapper .cube-inner .top[data-v-bc50a1ba] {
	-webkit-transform: rotateX(90deg) translateZ(25px);
	transform: rotateX(90deg) translateZ(25px)
}

.cube-wrapper .cube-inner .top[data-v-bc50a1ba]:after {
	background-color: rgba(0,0,0,.2)
}

.cube-wrapper .cube-inner .bottom[data-v-bc50a1ba] {
	-webkit-transform: rotateX(-90deg) translateZ(25px);
	transform: rotateX(-90deg) translateZ(25px)
}

@-webkit-keyframes slow-spin-data-v-bc50a1ba {
	0% {
		-webkit-transform: rotateX(-33.5deg) rotateY(45deg);
		transform: rotateX(-33.5deg) rotateY(45deg)
	}

	to {
		-webkit-transform: rotateX(-33.5deg) rotateY(225deg);
		transform: rotateX(-33.5deg) rotateY(225deg)
	}
}

@keyframes slow-spin-data-v-bc50a1ba {
	0% {
		-webkit-transform: rotateX(-33.5deg) rotateY(45deg);
		transform: rotateX(-33.5deg) rotateY(45deg)
	}

	to {
		-webkit-transform: rotateX(-33.5deg) rotateY(225deg);
		transform: rotateX(-33.5deg) rotateY(225deg)
	}
}

@-webkit-keyframes fast-spin-data-v-bc50a1ba {
	0% {
		-webkit-transform: rotateX(-33.5deg) rotateY(45deg);
		transform: rotateX(-33.5deg) rotateY(45deg)
	}

	to {
		-webkit-transform: rotateX(-33.5deg) rotateY(-315deg);
		transform: rotateX(-33.5deg) rotateY(-315deg)
	}
}

@keyframes fast-spin-data-v-bc50a1ba {
	0% {
		-webkit-transform: rotateX(-33.5deg) rotateY(45deg);
		transform: rotateX(-33.5deg) rotateY(45deg)
	}

	to {
		-webkit-transform: rotateX(-33.5deg) rotateY(-315deg);
		transform: rotateX(-33.5deg) rotateY(-315deg)
	}
}
</style><div data-v-69ecf4ec="" class="logo"><a data-v-69ecf4ec="" href="/" class="router-link-exact-active router-link-active"><section data-v-bc50a1ba="" data-v-69ecf4ec="" class="cube-wrapper"><ul data-v-bc50a1ba="" class="cube-inner"><li data-v-bc50a1ba="" class="front"></li> <li data-v-bc50a1ba="" class="back"></li> <li data-v-bc50a1ba="" class="right"></li> <li data-v-bc50a1ba="" class="left"></li> <li data-v-bc50a1ba="" class="top"></li> <li data-v-bc50a1ba="" class="bottom"></li></ul> <ul data-v-bc50a1ba="" class="cube"><li data-v-bc50a1ba="" class="front"></li> <li data-v-bc50a1ba="" class="back"></li> <li data-v-bc50a1ba="" class="right"></li> <li data-v-bc50a1ba="" class="left"></li> <li data-v-bc50a1ba="" class="top"></li> <li data-v-bc50a1ba="" class="bottom"></li> <li data-v-bc50a1ba="" class="floor"></li></ul></section></a></div>

查看文章跳到评论

北京市 2017-11-01 01:41

#0

阅读 2223.3万

@意见反馈/技术支持/伊网/安企网

You keep pressing until it hurts. Then you know where to look。

查看文章跳到评论

广西南宁市 2017-10-31 18:14

#0

阅读 107.1万

PHP分割txt纯文本小说格式章节

火速标题截取后两个字中文汉字红色
PHP中文处理中文字符串截取(mb_substr)和获取中文字符串字数

  <?php
	$newwstt=mb_substr($r['name'],2,4,'utf-8');
	$r['name']=str_ireplace($newwstt,'<span class="fcred">'.$newwstt.'</span>',$r['name']);
  ?>

查看文章跳到评论

广西南宁市 2017-10-31 18:11

#0

阅读 43万

CSS3可控旋转Js播放音乐按钮

js将div中滚动条滚动到指定位置
Js代码：

onload = function () {
  //初始化
  scrollToLocation();
};
function scrollToLocation() {
  var mainContainer = $('#thisMainPanel'),
  scrollToContainer = mainContainer.find('.son-panel:last');//滚动到<div id="thisMainPanel">中类名为son-panel的最后一个div处
  //scrollToContainer = mainContainer.find('.son-panel:eq(5)');//滚动到<div id="thisMainPanel">中类名为son-panel的第六个处
  //非动画效果
  //mainContainer.scrollTop(
  //  scrollToContainer.offset().top - mainContainer.offset().top + mainContainer.scrollTop()
  //);
  //动画效果
  mainContainer.animate({
    scrollTop: scrollToContainer.offset().top - mainContainer.offset().top + mainContainer.scrollTop()
  }, 2000);//2秒滑动到指定位置
}

Html代码：

<div id="thisMainPanel" style="height:200px;overflow-y: scroll;border:1px solid #f3f3f3;">
    <div class="son-panel">我是类容区域-1</div>
    <div class="son-panel">我是类容区域-2</div>
    <div class="son-panel">我是类容区域-3</div>
    <div class="son-panel">我是类容区域-4</div>
    <div class="son-panel" style="height:160px;">我是类容区域-5</div>
    <div class="son-panel">我是类容区域-6</div>
    <div class="son-panel">我是类容区域-7</div>
    <div class="son-panel">我是类容区域-8</div>
</div>

查看文章跳到评论

广西南宁市 2017-10-31 15:07

#0

阅读 43万

CSS3可控旋转Js播放音乐按钮

html5 audio标签播放完成后事件

var audioaud = document.getElementById("fmmmedia");
audioaud.addEventListener('ended',function(){
		var ids = document.getElementById('fmmmedia');
		var target = document.getElementById('audio-btn');
        ids.pause();
		$(target).removeClass('on').addClass('off');
		$("#mmuslisss").hide();
	});

查看文章跳到评论

广西南宁市 2017-10-31 12:26

#0

阅读 2804.9万

常用html、demo代码

jquery each判断是否执行到最后一个元素

<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>menu</title>
<style type="text/css">
</style>
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
<script type="text/javascript">
    $ (function ()
    {
        var len = $ (":button").length;
        $ (":button").each (function (i, dom)
        {
            if (i === len - 1)
            {
                alert (i)
            }
        });
    })
</script>
</head>
<body>
    <button>toggle</button>
    <button>toggle</button>
    <button>toggle</button>
</body>
</html>

查看文章跳到评论

广西南宁市 2017-10-31 10:16

#0

阅读 53.9万

weiphp微信第三方开发框架新增插件后列表页新增页面空白解决办法

weiphp onethinkphp 多个编辑器bug修复

\Addons\EditorForAdmin

问题是由于框架没有考虑到一个页面多个uditor实例，所以框架中的写法是读取模型字段的时候，有编辑器类型的字段就引入ueditor的js文件，并创建1个imageEditor对象变量。但是这样有多个编辑器的情况下，ueditor初始化js文件和imageEditor肯定是会相互覆盖的。
我的解决方法是重写框架的加载方法，用静态变量判断是否已经加载了ueditor.all.js这个文件，如果加载了不重复加载。另外编辑器实例的创建使用!function(){}()风格，把imageEditor这个变量封装到函数中作为局部变量，千万不能放在全局中。

<else />
				<?php
					$_SESSION['nfasdfasdfsdasad']++;
					if($_SESSION['nfasdfasdfsdasad']==2){
				?>
			<script type="text/javascript" charset="utf-8" src="__STATIC__/ueditor/ueditor.config.js?v={:SITE_VERSION}"></script>
			<script type="text/javascript" charset="utf-8" src="__STATIC__/ueditor/ueditor.all.js?v={:SITE_VERSION}"></script>
			<script type="text/javascript" charset="utf-8" src="__STATIC__/ueditor/lang/zh-cn/zh-cn.js?v={:SITE_VERSION}"></script>
			<?php
				}
			?>
			<script type="text/javascript">
				$('textarea[name="{$addons_data.name}"]').attr('id', 'editor_id_{$addons_data.name}');
				window.UEDITOR_HOME_URL = "__STATIC__/ueditor/";
				window.UEDITOR_CONFIG.initialFrameHeight = parseInt('{$addons_config.editor_height}');
				window.UEDITOR_CONFIG.scaleEnabled = <eq name="addons_config.editor_resize_type" value="1">true<else />false</eq>;
				window.UEDITOR_CONFIG.imageUrl = '{:addons_url("EditorForAdmin://Upload/ue_upimg")}';
				window.UEDITOR_CONFIG.imagePath = '';
				window.UEDITOR_CONFIG.imageFieldName = 'imgFile';
				//在这里扫描图片
				window.UEDITOR_CONFIG.imageManagerUrl='{:addons_url("EditorForAdmin://Upload/ue_mgimg")}';//图片在线管理的处理地址
        		window.UEDITOR_CONFIG.imageManagerPath='';        
				var imageEditor = UE.getEditor('editor_id_{$addons_data.name}');
				//添加一下判断是否是单个按钮管理图片 需要执行一下代码
				<if condition="isset($addons_data['btnClassName'])" >
				imageEditor.ready(function () {
					  //设置编辑器不可用
					  imageEditor.setDisabled();
					  //隐藏编辑器，因为不会用到这个编辑器实例，所以要隐藏
					  imageEditor.hide();
					  //侦听图片上传
					  imageEditor.addListener('beforeInsertImage', function (t, arg) {
						 //将地址赋值给相应的input,只去第一张图片的路径
						 //console.log(t);
						 //console.log(arg);
						 <if condition="empty($addons_data['is_mult'])" >
						 	 //单张情况
						 	 $(".{$addons_data.name}_preview").html("");
						 	 var imghtml = $("<img src="+arg[0].src+" width='100' height='100'/>");
							
							 $(".{$addons_data.name}_preview").append(imghtml);
							 //储存路劲
							 //单张图片存储图片id
							  $("#editor_id_{$addons_data.name}").text(arg[0].id);
							 //图片预览
							 $(".{$addons_data.name}_preview").show();
							 //微信预览
							 $('.weixin-cover-pic').attr('src',arg[0].src);
							 //console.log(arg);
							 
						 <else />
						 	//多张情况
						 	var srcs = "";
							var srcIds = "";
							 //$(".{$addons_data.name}_preview").html("");
							 for(var i=0;i<arg.length;i++){
								 if(i==arg.length-1){
									srcs = srcs + arg[i].src;
									srcIds = arg[i].id;
								 }else{
									 srcs = srcs + arg[i].src+"|";
									 srcIds = srcIds + arg[i].id+",";
									 }
								var imghtml = $("<img src="+arg[i].src+" width='100' height='100'/>");
								$(".{$addons_data.name}_preview").append(imghtml);
								//console.log(arg[i].src);	 
							 }
							 $(".{$addons_data.name}_preview").append(imghtml);
							  $(".{$addons_data.name}_preview").show();
							  var oldIds = $("#editor_id_{$addons_data.name}").text();
							  //多张图片存储一逗号分隔的id串
							  $("#editor_id_{$addons_data.name}").text(oldIds+","+srcIds);
						 </if>
					  })
					  //增加按钮className
					  $('.{$addons_data.btnClassName}').bind('click',function(){
							var uploadImage = imageEditor.getDialog("insertimage");
								uploadImage.open();
						  })
					 
				 });
				 </if>
			</script>
				<?php
					if($_SESSION['nfasdfasdfsdasad']>2) $_SESSION['nfasdfasdfsdasad']=1;
				?>
		</eq>

广西南宁市2017-10-31 10:18:48

\Public\static\ueditor\ueditor.all.js

id: 'ueditor_' + Math.random(),//me.uid,

广西南宁市2017-10-31 10:19:49

\Addons\EditorForAdmin\content.html

查看文章跳到评论

广西南宁市 2017-10-30 17:17

#0

阅读 32.1万

js一些算法小技巧

可以使用亦或
int a = 2;
int b = 3;

a = a^b;
b = a^b;
a= a^b;

广西南宁市2017-10-30 17:17:28

你这种如果是两个对象交换就不行了把

广西南宁市2017-10-30 17:17:42

#¹只是基本类型交换基本类型大数据的交换节省个了很多性能

查看文章跳到评论

广西南宁市 2017-10-30 17:17

#0

阅读 32.1万

js一些算法小技巧

for(i in json)
最好写成 for(var i in json) 否则i就变成全局的了, 会污染整个window

查看文章跳到评论

广西南宁市 2017-10-28 16:42

置顶 #0

阅读 44.6万

利用CSS属性环绕布局Shapes绘制各个形状图形形状文本文字环绕特效

为 iPhoneX 而生的小效果
就是兼容不好，只有webkit内核支持。

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<style type="text/css">
		::-webkit-scrollbar{
			width: 0;
			height: 0;
		}
		*{
			margin: 0;
			padding: 0;
		}
		html,body{
			width: 100%;
			height: 100%;
			background: #000;
		}
		body{
			display: flex;
			justify-content: center;
			align-items: center;
		}
		ul{
			list-style: none;
		}
		li{
			padding: .5em;
			box-shadow: inset 0 0 10px #eee;
		}
		.wrap{
			position: relative;
			margin: 0 auto;
			width: 800px;
			height: 500px;
			overflow: auto;
			background: #fff;
			box-shadow: 0 0 15px #fff;
		}
		.po{
			position: absolute;
			left: 0;
			top: 155px;
			width: 30px;
			height: 190px;
			background: #000;
			border-radius: 0 100% 100% 0/0 100% 100% 0;
		}
		.fl{
			float: left;
			width: 40px;
			shape-outside: polygon(0 150px, 20px 152px, 30px 155px, 40px 170px, 40px 330px, 30px 345px, 20px 348px, 0 350px);
		}
	</style>
</head>
<body>
	<div class="wrap">
		<div class="po"></div>
		<div class="fl"></div>
		<div>
			<ul>
				<li>1</li>
				<li>2</li>
				<li>3</li>
				<li>4</li>
				<li>5</li>
				<li>6</li>
				<li>7</li>
				<li>8</li>
				<li>1</li>
				<li>2</li>
				<li>3</li>
				<li>4</li>
				<li>5</li>
				<li>6</li>
				<li>7</li>
				<li>8</li>
				<li>1</li>
				<li>2</li>
				<li>3</li>
				<li>4</li>
				<li>5</li>
				<li>6</li>
				<li>7</li>
				<li>8</li>
			</ul>
		</div>
	</div>
	<script type="text/javascript">
		var wrap = document.querySelector('.wrap');
		var ul = document.querySelector('.wrap ul');
		var fl = document.querySelector('.wrap .fl');
		var po = document.querySelector('.wrap .po');
		fl.style.height = ul.scrollHeight + 'px';
		wrap.onscroll = function(e){
			var s = wrap.scrollTop;
			fl.style.shapeOutside = 'polygon(0 '+(150+s)+'px, 20px '+(152+s)+'px, 30px '+(155+s)+'px, 40px '+(170+s)+'px, 40px '+(330+s)+'px, 30px '+(345+s)+'px, 20px '+(348+s)+'px, 0 '+(350+s)+'px)';
			po.style.top = 155 + s +'px';
		}
	</script>
</body>
</html>

查看文章跳到评论

广西南宁市 2017-10-28 16:40

#0

阅读 44.6万

利用CSS属性环绕布局Shapes绘制各个形状图形形状文本文字环绕特效

查看文章跳到评论

广西南宁市 2017-10-28 14:44

#0

阅读 32.6万

让输入框获取焦点 JS

div等标签获取焦点绑定keypress等事件

<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title></title>
		<style>
			.box{
				width: 300px;
				padding: 30px 20px;
				background-color: #f4d5e8;
				margin: 50px;
				font-size: 24px;
				color: #ccc;
				text-align: center;
			}
			#box2{
				color: #4c9579;
				background-color: #d5f4e8;
			}
			.box:focus{
				border: solid 1px #d5e8f4;
				box-shadow: 0 0 5px 2px #d5e8f4;
			}
		</style>
	</head>

	<body>
		<div class="box" id="box1">我不能获得焦点</div>
		<div class="box" id="box2" tabindex="1">点我可以获得焦点。因为我有【tabindex】属性</div>
		<script>
			document.getElementById('box2').onfocus = function(){
				this.innerHTML = "现在请敲击键盘！！";
			}
			
			document.getElementById('box2').onblur = function(){
				this.innerHTML = "点我可以获得焦点。因为我有【tabindex】属性";
			}
			
			//能获得焦点的div才可以使用keypress等键盘事件
			document.getElementById('box2').onkeypress = function(e){
				this.innerHTML = "只有获得焦点，才能用keypress等事件。您按的是【"+e.key+"】。";
			}
			
			//没有焦点的div等普通dom元素  就算绑定也没用！
			document.getElementById('box1').onkeypress = function(e){
				alert('就算绑定了也没用！！');
			}
		</script>
	</body>
</html>

查看文章跳到评论

lizhenqiu blog

最新评论聚合

Windows环境安装PHP redis扩展

理解JavaScript构造函数

理解JavaScript构造函数

理解box-sizing布局

理解JavaScript构造函数

理解JavaScript构造函数

JavaScript简写技巧

JavaScript简写技巧

常用html、demo代码

@意见反馈/技术支持/伊网/安企网

PHP分割txt纯文本小说格式章节

CSS3可控旋转Js播放音乐按钮

CSS3可控旋转Js播放音乐按钮

常用html、demo代码

weiphp微信第三方开发框架新增插件后列表页新增页面空白解决办法

js一些算法小技巧

js一些算法小技巧

利用CSS属性环绕布局Shapes绘制各个形状图形形状文本文字环绕特效

利用CSS属性环绕布局Shapes绘制各个形状图形形状文本文字环绕特效

让输入框获取焦点 JS