php版bitmap

###二进制转十进制
32位机器上的自然数一共有4294967296个,
如果用一个bit来存放一个整数,1代表存在0代表不存在,那么把全部自然数存储在内存只要4294967296 / (8 * 1024 * 1024) = 512MB(8bit = 一个字节)
而这些自然数存放在文件中,一行一个数字,需要20G的容量。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
     
class BitMap
{
public static $map = [];
//插入值
public static function setValue($value) {
$index = self::getIndex($value);
if (isset(self::$map[$index])) {
self::$map[$index] |= 1 << ($value & 31);
} else {
self::$map[$index] = 1 << ($value & 31);
}
/* (1) $value & 31 相当于 $value % 32 ,
* 这个是取当前的值标示是否存在的位置
* 例如$value = 67 得到3 位置应该是在二进制从右往左数的下标3的位置也就是第四位
* (2) 1 << ($value & 31) 就是 把当前得到的值转化成二进制的位置
* 例如$value = 67 得到3 3的二进制 为11 向左偏移3位 得到2进制 1000
* (3) |= 是 按位或运算并赋值
* 所以当前$map[$index] 的二进制的值为 1000 十进制就是8
*/


echo "当前值的二进制:".(decbin($value))."\n";
echo "取模位置左移1:".(decbin(1 << ($value & 31))).'-'.(1 << ($value & 31))."\n";
echo "插入后map:".(decbin(self::$map[$index])).'-'.(self::$map[$index])."\n";
}
//查找某个值是否存在
public static function haxValue($value) {
$index = self::getIndex($value);
if (!isset(self::$map[$index])) {
return false;
}
/**
* 例如传入的值为87,bitmap中存的值为67
* (1) 1 << ($value & 31) 得到1<<23 ,1左偏移23位,
* 得到 二进制值为 100000000000000000000000 也就是十进制的8388608
* (2) 然后和 self::$map[$index] 进行按位与(二进制1000 和 二进制 100000000000000000000000)
* 得到二进制 000000000000000000000000也就是十进制的0 也就是不存在
* 如果存在则返回这个数在self::$map[$index] 中的位置转换成的十进制的值 (如67返回8二进制也就是1000)
*/
if ((self::$map[$index] & (1 << ($value & 31)))==0) {
return false;
}
return true;
}

public static function display()
{
$keys = array_keys(self::$map);
foreach ($keys as $key) {
print "map index: {$key}, bit:\n";
$temp = self::$map[$key];
$bit_str = '';
for ($i = 0; $i <= 31; $i++) {
$bit_str = (1 & $temp) . $bit_str;
echo ($bit_str)."\n";
$temp >>= 1;
}
echo "{$bit_str}\n";
}

}
//去出在数组的第几个key里面
private static function getIndex($value) {
return $value >> 5;
/**
* 相当于floor($value / 32);
* 这里是2进制运算当前值右移动5位
* 例如67 二进制为1000011 右移动5位二进制为10 十进制为2
*/
}
}


$list = [67];
foreach ($list as $value) {
BitMap::setValue($value);
}

BitMap::display();
var_dump(BitMap::haxValue(87));

2进制10进制转换

###二进制转十进制

1
2
3
4
例:二进制110101转10进制
= 1 * 2^5 + 1 * 2^4 + 0 * 2^3 + 1 * 2^2 + 0 * 2^1 + 1 * 2^0
= 32 + 16 + 0 + 4 + 0 + 1
= 53

上面是2进制转10进制所以是用2的次方 , 如果3制转10进制那就用3的次方

###十进制转2进制

1
2
3
4
5
6
7
8
例:十进制53转2进制 
= 53/2 = 26 余1
= 26/2 = 3 余0
= 13/2 = 6 余1
= 6/2 = 3 余0
= 3/2 = 1 余1
= 1/2 = 0 余1
然后余数倒序 = 110101

上面是转2进制所以除2 , 如果转3进制就除3 ,4进制就除4

MySQL修改root密码的几种方法

方法1: 用SET PASSWORD命令

首先登录MySQL。

格式:mysql> set password for 用户名@localhost = password(‘新密码’);

例子:mysql> set password for root@localhost = password(‘admin100’);

上面例子将用户root的密码更改为admin100

方法2:用mysqladmin

格式:mysqladmin -u用户名 -p旧密码 password 新密码

例子:mysqladmin -uroot -p123456 password admin100

上面例子将用户root原来的密码123456改为新密码admin100

方法3:用UPDATE直接编辑user表

首先登录MySQL。

mysql> use mysql;

mysql> update user set password=password(‘admin100’) where user=’root’ and host=’localhost’;

mysql> flush privileges;

方法4:在忘记root密码的时候,可以这样。

以windows为例:

  1. 关闭正在运行的MySQL服务。

  2. 打开DOS窗口,转到mysql\bin目录。

  3. 输入mysqld –skip-grant-tables 回车。–skip-grant-tables 的意思是启动MySQL服务的时候跳过权限表认证。

  4. 再开一个DOS窗口(因为刚才那个DOS窗口已经不能动了),转到mysql\bin目录。

  5. 输入mysql回车,如果成功,将出现MySQL提示符 >。

  6. 连接权限数据库: use mysql; 。

  7. 改密码:update user set password=password(“admin100”) where user=”root”;(别忘了最后加分号) 。

  8. 刷新权限(必须步骤):flush privileges;。

  9. 退出 quit。

  10. 注销系统,再进入,使用用户名root和刚才设置的新密码admin100登录。

HTTP状态码

HTTP状态码(HTTP Status Code)是用来表示网页服务器HTTP 响应状态的3位数字代码。它由RFC 2616规范定义的,并得到RFC 2518、RFC 2817、RFC 2295、RFC 2774、RFC 4918等规范扩展。所有状态码的第一个数字代表了响应的五种状态之一

HTTP/1.1定义的状态码值和对应的原因短语(Reason-Phrase)的例子。
1XX表示:消息
这一类型的状态码,代表请求已被接受,需要继续处理。这类响应是临时响应,只包含状态行和某些可选的响应头信息,并以空行结束。由于HTTP/1.0 协议中没有定义任何1xx状态码,所以除非在某些试验条件下,服务器禁止向此类客户端发送1xx响应。 这些状态码代表的响应都是信息性的,标示客户应该采取的其他行动。
100 : Continue 客户端应当继续发送请求。这个临时响应是用来通知客户端它的部分请求已经被服务器接收,且仍未被拒绝。客户端应当继续发送请求的剩余部分.
101 : witching Protocols 服务器已经理解了客户端的请求,并将通过Upgrade消息头通知客户端采用不同的协议来完成这个请求。在发送完这个响应最后的空行后,服务器将会切换到 在Upgrade消息头中定义的那些协议。: 只有在切换新的协议更有好处的时候才应该采取类似措施.
102: Processing 由WebDAV(RFC 2518)扩展的状态码,代表处理将被继续执行。
2XX表示:成功
这一类型的状态码,代表请求已成功被服务器接收、理解、并接受。
200 : OK
201 : Created 已创建
202 : Accepted 接收
203 : Non-Authoritative Information 非认证信息
204 : No Content 无内容
205 : Reset Content 重置内容
206 : Partial Content 服务器已经成功处理了部分GET请求。类似于FlashGet或者迅雷这类的HTTP 下载工具都是使用此类响应实现断点续传或者将一个大文档分解为多个下载段同时下载。
207: Multi-Status 由WebDAV(RFC 2518)扩展的状态码,代表之后的消息体将是一个XML消息,并且可能依照之前子请求数量的不同,包含一系列独立的响应代码.
3XX表示: 重定向
这类状态码代表需要客户端采取进一步的操作才能完成请求。通常,这些状态码用来重定向,后续的请求地址(重定向目标)在本次响应的Location域中指明。
300 : Multiple Choices 多路选择
301 : Moved Permanently 永久转移
302 : Found 暂时转移
303 : See Other 参见其它
304 : Not Modified 未修改
305 : Use Proxy 使用代理
306: Switch Proxy 在最新版的规范中,306状态码已经不再被使用。
307 : Temporary Redirect 请求的资源现在临时从不同的URI响应请求。由于这样的重定向是临时的,客户端应当继续向原有地址发送以后的请求。只有在Cache-Control或 Expires中进行了指定的情况下,这个响应才是可缓存的。
4XX表示: 客户端错误
这类的状态码代表了客户端看起来可能发生了错误,妨碍了服务器的处理。
400 : Bad Request 错误请求
401 : Unauthorized 未认证
402 : Payment Required 需要付费
403 : Forbidden 禁止
404 : Not Found 请求失败,请求所希望得到的资源未被在服务器上发现
405 : Method Not Allowed 方法不允许
406 : Not Acceptable 不接受
407 : Proxy Authentication Required 需要代理认证
408 : Request Time-out 请求超时
409 : Conflict 冲突
410 : Gone 失败
411 : Length Required 需要长度
412 : Precondition Failed 条件失败
413 : Request Entity Too Large 请求实体太大
414 : Request-URI Too Large 请求URI太长
415 : Unsupported Media Type 不支持媒体类型
416 : Requested range not satisfiable 如果请求中包含了Range请求头,并且Range中指定的任何数据范围都与当前资源的可用范围不重合,同时请求中又没有定义If-Range请求头,那 么服务器就应当返回416状态码。
417 : Expectation Failed 在请求头Expect中指定的预期内容无法被服务器满足
421 :There are too many connections from your internet address 从当前客户端所在的IP地址到服务器的连接数超过了服务器许可的最大范围。通常,这里的IP地址指的是从服务器上看到的客户端地址.
422: Unprocessable Entity 请求格式正确,但是由于含有语义错误,无法响应。(RFC 4918 WebDAV)
423: Locked 当前资源被锁定。(RFC 4918 WebDAV)
424: Failed Dependency 由于之前的某个请求发生的错误,导致当前请求失败,例如PROPPATCH。(RFC 4918 WebDAV)
425: Unordered Collection 在WebDav Advanced Collections草案中定义,但是未出现在《WebDAV顺序集协议》(RFC 3658)中。
426:Upgrade Required 客户端应当切换到TLS/1.0。(RFC 2817)
449: Retry With 由微软扩展,代表请求应当在执行完适当的操作后进行重试。
5XX表示: 服务器错误
这类状态码代表了服务器在处理请求的过程中有错误或者异常状态发生
500 : Internal Server Error 服务器遇到了一个未曾预料的状况,导致了它无法完成对请求的处理。一般来说,这个问题都会在服务器的程序码出错时出现
501 : Not Implemented 未实现
502 : Bad Gateway 作为网关或者代理工作的服务器尝试执行请求时,从上游服务器接收到无效的响应
503 : Service Unavailable 由于临时的服务器维护或者过载,服务器当前无法处理请求。这个状况是临时的,并且将在一段时间以后恢复。
504 : Gateway Time-out 网关超时
505 : HTTP Version not supported 服务器不支持,或者拒绝支持在请求中使用的HTTP版本。这暗示着服务器不能或不愿使用与客户端相同的版本。响应中应当包含一个描述了为何版本不被支持以及服务器支持哪些协议的实体。
506 : Variant Also Negotiates 由《透明内容协商协议》(RFC 2295)扩展,代表服务器存在内部配置错误:被请求的协商变元资源被配置为在透明内容协商中使用自己,因此在一个协商处理中不是一个合适的重点。
507 : Insufficient Storage 服务器无法存储完成请求所必须的内容。这个状况被认为是临时的。WebDAV(RFC 4918)
509 : Bandwidth Limit Exceeded 服务器达到带宽限制。这不是一个官方的状态码,但是仍被广泛使用。
510 : Not Extended 获取资源所需要的策略并没有没满足。

css去除webkit内核的默认样式

##前言
做移动端的朋友应该知道,iphone的默认按钮是个很恶心的圆角,select下拉框也有默认样式无法修改。

###解决办法
这时候可以用到的
在按钮和select样式里加入下面css
–webkit–appearance:none //去除默认样

###示例代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
input{
background:#FF9933;
border–radius:5px;
color:#fff;
padding:3px 20px;
–webkit–appearance:none;
}
select{
background:url(images/img1.jpg) no–repeat;
background–size:20px;
background–position:95% center;
padding:3px 10px;
width:30%;
–webkit–appearance:none;
}

jquery图片上传插件,支持进度条,非flash,v1.2版

插件代码

需要先引入jquery

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
/**
* v1.1
* 田丰硕 tianfs.com
*/
(function ($) {
$.extend($.fn, {
upload: function (settings) {

var options = $.extend({
fileType: "gif|jpg|jpeg|png|bmp", //允许的文件格式
uploadUrl: "", //上传URL地址
inputName: "upfile",
uploadData: {}, //上传时需要附加的参数 可以是 function
beforeSubmitFn: "", //上传前执行的方法 原型 beforeSubmit(xhr, $this);
successFn: "", //上传成功后执行的方法 uploadSuccess(response, statusText, xhr, $this)
errorFn: "", //上传失败后执行的方法
onProgress:"" //返回上传进度信息
}, settings);

//上传准备函数
var methods = {
//验证文件格式
checkFile: function (filename) {
var pos = filename.lastIndexOf(".");
var str = filename.substring(pos, filename.length);
var str1 = str.toLowerCase();
if (typeof options.fileType !== 'string') { options.fileType = "gif|jpg|jpeg|png|bmp"; }
var re = new RegExp("\.(" + options.fileType + ")$");
return re.test(str1);
},
createInputFile: function(){
/*var new_fileType = options.fileType.replace(/\|/g,",");
new_fileType = "."+new_fileType;
Prompt.topShow(new_fileType)
var $input = $("<input type='file' name='"+options.inputName+"'> accept='"+new_fileType+"'");*/
var $input = $("<input type='file' class='upload_tmp_input' style='display:none' name='"+options.inputName+"'> ");
return $input;
},
onload: function () {

}
};
//上传主函数
this.each(function () {
var $this = $(this);
$this.bind("click", function () {
$(".upload_tmp_input").remove()
//创建input file
var $input = methods.createInputFile();
$this.before($input);
$input.change(function(){
if ($input.val() === "") {
alert("请选择要上传的文件!");
return false;
}
//验证图片
if (!methods.checkFile($input.val())) {
alert("文件格式不正确,只能上传格式为:" + options.fileType + "的文件。");
return false;
}
var pic = $input.get(0).files[0];
var formData = new FormData();
formData.append(options.inputName , pic);
if (typeof options.uploadData == 'function') {
var data = options.uploadData($this);
if (data) {
for (var x in data) {
formData.append(x , data[x]);
}
}
} else {
if (options.uploadData) {
for (var x in options.uploadData) {
formData.append(x , options.uploadData[x]);
}
}
}
/**
* 必须false才会避开jQuery对 formdata 的默认处理
* XMLHttpRequest会对 formdata 进行正确的处理
*/
$.ajax({
type: "POST",
url: options.uploadUrl,
data: formData ,
processData : false,
//必须false才会自动加上正确的Content-Type
contentType : false ,
dataType : "JSON",
xhr: function(){
var xhr = $.ajaxSettings.xhr();
xhr.upload.addEventListener("progress" , function (evt){
console.log(evt);
var loaded = evt.loaded; //已经上传大小情况
var tot = evt.total; //附件总大小
var per = Math.floor(100*loaded/tot); //已经上传的百分比
var onProgress;
try { onProgress = eval(options.onProgress) } catch (err) { };
if (onProgress) {
onProgress(per, $this);
}
}, false);
return xhr;
},
beforeSend:function (xhr) {
$this.attr("disabled", true);
var beforeSubmitFn;
try { beforeSubmitFn = eval(options.beforeSubmitFn) } catch (err) { };
if (beforeSubmitFn) {
var $result = beforeSubmitFn(xhr, $this);
if (typeof ($result) == "boolean")
return $result;
}
},
error : function (response, statusText, xhr) {
var errorFn;
try { errorFn = eval(options.errorFn) } catch (err) { };
if (errorFn) {
errorFn(response, statusText, xhr, $this);
}
$this.attr("disabled", false);
$input.remove();
},
//上传成功
success : function (response, statusText, xhr) {
//response = eval("(" + response + ")");
var successFn;
try { successFn = eval(options.successFn) } catch (err) { };
if (successFn) {
$.ajaxSetup({ cache: false });//这个不能少,否则ie下会提示下载
successFn(response, statusText, xhr, $this);
}
$this.attr("disabled", false);
$input.remove();
}

});
})
$input.click()
});

});
}
});
})(jQuery)

使用代码

1
2
3
4
5
6
7
8
9
$(“.upload-quan”).upload({
uploadData: {},
uploadUrl : “”,
inputName: “upfile”,
fileType: “bmp|png|jpeg|jpg|gif”,
successFn: function (response, statusText, xhr, $this) {
console.log(response);
}
});

用css3 media实现响应式布局

##前言
响应式布局,说直白点就是一个网站能够兼容多个终端,可以按不同的分辨率显示不同的状态。而实现这个就要用到css3的Media Queries(媒介查询)。这个功能非常的强大,但是有优点的同时,缺点也是会存在的。那就是兼容各种设备工作量大,效率低下,加载时间长等。但是学起来很容易,看完下面的代码你就会了。

###示例代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
.page{
width:960px;
height:1000px;
margin:0 auto;
background:#CCC;
}
/* 设备最大宽度960px */
@media screen and (max–width: 960px) {
.page{
width:100%;
background:#69F;
}
}
/* 宽度大于480px且小于768px */
@media screen and (min–width: 480px) and (max–width:768px) {
.page{
width:100%;
background:#F00;
}
}
/* 设备最大宽度480px */
@media screen and (max–width:480px){
.page{
width:100%;
background:#00FF00;
}
}

这样就可以在不同的分辨率下采取不同的样式了。

另外还有一点,如果是移动端开发,一定要在头部加上以下代码。

怎么样,很容易吧。当然这只是响应式布局的一部分,其他的可以网上搜索相关资料。以上,只是个人对于响应式布局的一些理解,技术更新的速度很快,所以我们也要与时俱进。

用一个数值保存多选的值

前言

在开发过程中,对于网页中的多选,我们有很多种存储方式,常见的如逗号分隔。下文介绍一种通用设计方式:用一个整数来存储复选框的值。

准备知识 —— 位与运算

位与运算:二进制运算,相同位的两个数字都为1,则为1;若有一个不为1,则为0,如:

1
2
3
4
5
 下方是运算
00101
& 11100
------------
00100

设计

将多项的选项值分别设置为 2 的 n 次方,n 从 0 开始,每多一项,n + 1。即 1,2,4,8…
多选的存储值为各项值之和,如选中了第 1、3 项,则值为:1 + 4 = 5

1
$ hexo server

回显

假设存储的值为 5 ,要使相应的项被勾选,则是循环多项的值,每项与存储值 5 进行 位与运算,如果值与选项本身的值相等,则选中该项;相反地,如果运算值为 0 ,则设置为不选中:

1
2
3
4
5
下方回显
1 & 5 = 1
2 & 5 = 0
4 & 5 = 4
8 & 5 = 0

示例

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!DOCTYPE html> 
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Checkbox Test</title>
</head>
<body>
<form>
<input type="checkbox" name="test" value="1"> 1
<input type="checkbox" name="test" value="2"> 2
<input type="checkbox" name="test" value="4"> 4
<input type="checkbox" name="test" value="8"> 8
</form>
<input type="text" id="result" placeholder="设置要回显的值">
<button id="show">回显</button>
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script>
$(function () {
$("[name='test']").on("change", function () {
var result = 0;
$("[name='test']:checkbox:checked").each(function(){
result += parseInt($(this).val());
});
$("#result").val(result); });
$("#show").on("click", function () {
var result = parseInt($("#result").val());
$("[name='test']:checkbox").each(function(){
var value = parseInt($(this).val());
if ((result & value) == value) {
$(this).prop("checked", true);
} else {
$(this).prop("checked", false);
}
});
});
});
</script>
</body>
</html>