ajax如何实现、readyState五种状态的含义

ajax实现

var getXmlHttpRequest = function () {
    if (window.XMLHttpRequest) {       
        return new XMLHttpRequest();
    } else if (window.ActiveXObject) {
        //低版本的IE浏览器没有提供XMLHttpRequest对象
        //所以必须使用IE浏览器的特定实现ActiveXObject
        return new ActiveXObject("Microsoft.XMLHTTP");
    }
};
var xhr = getXmlHttpRequest();
xhr.open("TYPE", "URL", true);
xhr.send(""); 
xhr.onreadystatechange = function () {
    if (xhr.readyState === 4 && xhr.status === 200) {       
        //数据在xhr.responseText
    }
};

readyState的四种状态

- 阅读剩余部分 -

js闭包

闭包就是能够读取其他函数内部变量的函数
来自阮一峰博客

例如

function f1(){
　　　　var n=999;
　　　　function f2(){
　　　　　　alert(n); 
　　　　}
　　　　return f2;
　　}
　　var result=f1();
　　result(); // 999

- 阅读剩余部分 -

计算滚动条的宽度

在做一个图片放大功能，给html加上overflow:hidden之后发现网页会跳动

原因是hidden之后，滚动条消失，body的宽度就会增加。

看了一下知乎的实现，大概就是先计算出滚动条的宽度，当html加overflow:hidden的时候，让html本身向右偏移，偏移的像素就是滚动条的宽度。同理，滚动条出现的时候，取消偏移。

滚动条宽度 = 窗口宽度 - 内容宽度

width = window.innerWidth - document.body.scrollWidth

移动端滚动穿透问题新解

今天遇到一个问题，就是在一个弹出层里面有一个可滚动的列表，当列表弹出层列表滚动的时候，原来的页面也跟着滚动了，体验相当不好。

在PC还好，可以给body一个overflow:hidden完事，在移动端却不管用啊

查了一下，这个叫移动端滚动穿透，一个大神给出了解决方案：点这里，感觉还是太麻烦了

然后自己琢磨了一番，想到了一个简单的处理方法。

既然滚动是因为内容超出了父级容器，那么就好办了，直接让内容不超出就好了。

直接让内容脱离文档流，使用position:fixed，当弹出层弹出的时候直接在body上加绝对定位position:fixed，当弹出层消失的时候，把原来页面的定位去掉。嗯，就这么简单。

看代码

- 阅读剩余部分 -

typecho图片上传失败解决办法

最近发现typecho上传图片一直失败，开始以为是uploads文件夹权限问题，后来权限改为777，根本没用啊，内心是崩溃的。

额，我又要水一篇了，后来查了一下，大致原因是开发版的typecho存在的一些bug，其中某个函数在检查是否在app engine上运行，获取环境变量的时候错了。

- 阅读剩余部分 -

有关http请求的拦截

function addXMLRequestCallback() {
    var oldSend = XMLHttpRequest.prototype.send;
    XMLHttpRequest.prototype.send = function () {
        this.addEventListener('load', function () {
             console.log('request completed!');
             //will always be 4 (ajax is completed successfully)
             console.log(this.readyState); 
             console.log(this.responseText); 
            });
                oldSend.apply(this, arguments);
            }
        }
        addXMLRequestCallback();

js获取指定时间转换时间戳问题

前几天写了一个活动的倒计时，在chrome测试正常之后就没管了，今天打开手机发现NaN

测试了几台手机，发现安卓手机正常，IOS和IE有问题，那问题应该是出现在时间转换上面。

new Date("2017-07-12 00:00:00")这一句在IOS下面返回了NaN

然后尝试改变字符串的传入方式new Date("2017/07/12 00:00:00")

发现正常，IOS不支持用-拼接的字符串

时间是后端返回的，要用正则替换一下原来的-

 var startTime = '2017-07-12 00:00:00';
 startTime = startTime.replace(/\-/g, '/');
 startTime = new Date(startTime).getTime();

参考：http://dygraphs.com/date-formats.html

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6