稍微整理下一些走过的问题

###1. 关于事件的解除绑定###
如果业务的需求或者是切换router的时候，需要将一些事件解除原来的绑定，

var eventFunc = function (){
    /*Event function*/
}
$("#a").bind("click",eventFunc);
$("#a").unbind("click",eventFunc);

一般的情况这样即可，但是如果要将eventFunc绑定下一个this的作用域呢,可能会直接的eventFunc.bind(this)，这样来写了，可后来测试了下没有用，其实原因就在于bind函数的问题，在MDN上给bind的解释是

bind()方法会创建一个新函数,称为绑定函数.当调用这个绑定函数时,绑定函数会以创建它时传入
 bind()方法的第一个参数作为 this,传入 bind() 方法的第二个以及以后的参数加上绑定函数
 运行时本身的参数按照顺序作为原函数的参数来调用原函数.

大致的情况就是每次bind都是返回一个新的函数，所以类似eventFunc.bind(this)===eventFunc.bind(this)返回的是false，解决的办法可以声明一个eventFunc2 = eventFunc.bind(this)，然后每次绑定和解除绑定都使用这个

###2. 关于usagent的正则匹配

一般做一些简单的在移动端做一些usagent的检测用正则来检测，比如来监测android，会写

var testAndroid = /(android)/ig;
testAndroid.test(navigator.userAgent.toLowerCase());

来进行判断,类似这样的头

"mozilla/5.0 (linux; android 4.2.1; en-us; nexus 4 build/jop40d) applewebkit/535.19 (khtml, like gecko) chrome/18.0.1025.166 mobile safari/535.19"

当然会返回true，但是要是在运行一次testAndroid.test(navigator.userAgent.toLowerCase());结果却是false

原因是每个正则表达式都有一个 lastIndex 属性，用于记录上一次匹配结束的位置,所以第二次匹配的时候不是从０开始，解决的办法就是testAndroid.lastIndex＝０设置下

正则有时间必须要好好深入看看

###3. 关于location.reload()

window.location.reload()，一直使用的时候，都没注意里面的参数，直到上次在FF下遇到一个类似缓存的问题了，才看了下貌似有这么一段东西

如果该方法没有规定参数，或者参数是 false，它就会用 HTTP 头 If-Modified-Since 来检测服务器上
的文档是否已改变。如果文档已改变，reload() 会再次下载该文档。如果文档未改变，则该方法将从缓存
中装载文档。这与用户单击浏览器的刷新按钮的效果是完全一样的。

如果把该方法的参数设置为 true，那么无论文档的最后修改日期是什么，它都会绕过缓存，从服务器上重新下
载该文档。这与用户在单击浏览器的刷新按钮时按住 Shift 健的效果是完全一样。

偶尔间看到一个好玩的535 ways to reload

###4. 浮动元素并排放兼容问题
IE7 下浮动元素并排放置不设置高度会错位,这个原因还未知，但是也是通过这个方法得到了解决

###5. 关于IE7下的tr
IE7下不能设置tr的border。解决的方法及就是用td来设置

关于这种兼容性的问题，也真是头疼，只能遇到一个解决一个，可惜没有一个银弹，推荐的是一个网站can I use　自行google，里面有很多详细的兼容介绍

###6. IE下有些margin属性的问题
IE下有些margin-left为负数没有用（查看下IEbug里面是否有这样的案例）zoom：1触发下haslayout就好了，貌似网上找到了一个例子可以看看RB1001

###7. float 左右布局，左右div等高
关于实现float 左右布局，左右div等高的方法有，很多种，具体的可以看博文

这个方法的原理是事先通过正内边距来使其拥有足够高的布局控件，然后通过负外边距来使得其的位置不变。通过给父元素溢出隐藏，我们可以隐藏掉事先占据的足够高的空间。由两列实际的内容高度来决定整个父元素的高度，从而实现了等高。 当一列不浮动搭配正内边距加负外边距，父元素溢出隐藏，它的高度跟还是由内在元素来决定。css的精华在于，总容器里面加：overflow:hidden; 多列容器里面加：padding-bottom:32767px; margin-bottom:-32767px;

###8. 关于遇到一些多选的问题
对于一些表单，有很多多选题的时候，有一个比较投机的处理办法，就是使用位运算来进行区分1 2 4 8　类似0001 0010 0100 1000
一个不错的办法

###9. 关于一些情况下的margin
如下一段代码

/*css*/
.container{width: 700px;height: 500px;background-color: red;}
/*html*/
<div class="container">
    <div class="body1">11212</div>
</div>

效果如下

然后我们在给body加点样式

/*css*/
.body1{margin-top:50px;}

效果如下
可以发现父元素设置的背景色，还是跟子元素里面的内容紧贴，虽然确实是有margin的效果，但是父元素的背景色却没有将子元素的margin的间隙填满,这个效果出现的原因是父元素的第一个子元素的上边距margin-top如果碰不到有效的border或者padding,就会不断一层一层的找自己祖先元素
个人的理解是发生了margin的重叠，子元素的margin跟父元素的margin-top进行叠加，最后将整体的margin体现在父元素上，对于解决的方案也有几种

1. 将父元素构建一个bfc
2. 给父元素加上border-top或者padding-top
3. 对子元素试用padding-top

顺便提到一篇文章关于magin的很不错

###10. 关于windows.open
之前做过一个功能，大致是这样的情况，用于点击一个按钮，然后向服务端发起请求，如果请求成功则打开一个新的页面，记得当时测试的时候，在chrome浏览器中会出现，请求成功但是没有成功打开新的窗口的功能，貌似这个打开的被浏览器拦截。后来将这个异步的请求修改为同步之后就又可以了。这个应该是跟浏览器内部的安全机制有关。
具体可以看看这个文章window.open为何会被浏览器拦截

###其他

1. 如果在页面做一个设备的识别然后进行调转。如果页面中 有加载图片的过程，可能会出现的是图片还没加载完毕，然后就进行链接的跳转的，这样的结果是看到的图片还没加载完毕就会被打断，然后看不到图片