遇到的bug | feYAN7

遇到的bug

YAN7 6月 20, 2016

遇到的bug都记录下来，避免自己犯相同的错误

在面向对象的程序中，如果设置了参数，但是调用该函数时，没有传入实参，那么就会报错。

解决办法: 参数一定要传齐，或者书写形参的时候设置默认值.
要并排的两个div元素设为inline-block后，有一个元素会掉下来，这是因为行内元素会有一些对齐方式的问题

解决方法：给两个div元素设为一个左浮，一个右浮
使用angular框架时，使用window.onload会导致出错

解决方法：不需要使用window.onload就可以了
li标签悬停时，会因为边框的原因导致li标签颤抖

解决方法：给li标签加上和背景色一样的边框，这样鼠标悬停时只会改变边框的颜色而不改变边框的大小
搜索框不能和搜索按钮无缝连接，总是有1px的空隙

解决方法：这是html页面换行导致的空格合并导致的空隙，只要把两个input在写html页面的时候收尾相连就可以了，或者直接左浮也可以。
oh-my-zsh修改皮肤后，皮肤没效果并且iterm2报错

解决方法：是因为修改皮肤的时候用了中文的引号，所以文件报错，当看起来很正常的文件报错时，就要注意语法、标点符号这些细节了。
不能直接在for循环中操作数组长度

把要删除的元素放进一个空数组中，遍历完后再操作这个数组，而不是直接在for循环中删除元素
在sublime中不能直接通过ajax请求文件

解决办法：通过sublime的插件httpserve来启动文件，就可以请求到文件，并且请求的文件一定要在当前目录下
angular中，有bug一直调试不出来，后来发现是给控制器以数组的形式传入第二个参数的时候，前面的参数和回调函数中的形参个数不一致

解决办法：angular中，控制器等的传的参数个数要和回调函数中的参数个数一样
sublime的http servers插件启动不了

解决办法：这是因为自己在iterm中启动了另一个servers服务，导致两者冲突启动不了，关掉iterm中的servers服务就好了
给div设置border，然后用四个绝对定位到可视范围外的div鼠标悬浮触发div覆盖border，结果四个div不能显示在页面.

解决办法：overflow:hidden 的属性只包括盒子的content和padding，不包括border和margin，所以想要覆盖通过overflow:hidden来让覆盖border显示不不可行的，要在该盒子的下一层设置border，然后覆盖这层的border，这样就可以可以了。
使用c3属性transition做动画时，直接显示出来而不是以动画的形式出来

解决方法：因为我把transition这个属性加在了hover的标签上，而没有加在
圣杯布局中，右边的div会掉下来

解决方法：给中间的div设定宽度为100%，这个百分百是对于content的区域来说的，和padding物管，所以要先给中间的div设置两边的padding刚好为左右两个div的宽度，这样左右两个div就不占大div的宽度，再给中间的div设置宽度为100%就可以了，还要注意给中间的盒子和大盒子设置最小宽度.
流式布局中，遇到左右两个div的布局，缩放的时候两者的距离不可控

解决方法：因为设置定位的时候两个div都是根据父盒子来定位的，所以缩放时肯定改变两者的距离，所以要根据他们的相对位置来定位，比如给两个div都绝对定位到同一个位置，然后给其中一个设置margin-left之类的，这样不管怎么缩放他们之间的距离都是不变的.
使用c3动画@keyframes以及animation属性时，老是写不对，动画出不来,

解决办法：一开始是自己自己写错了@keyframes的名字，动画死活不动，后来动画不能定在最后一帧，百度解决，总结还是自己对c3动画还很不熟悉，要多做demo，读属性。
cs属性中scale。tranlate等2d转换属性转换的时候很突兀，没有动画效果

解决方法：加个transition: all 0.5s ease-in; get!
左边固定宽度，右边自适应的布局布置不出来

解决方法：自己给右边的盒子设置了padding-left,这样是不对的.正确方法是左边的盒子要设置margin-left且为负值，右边的盒子设置width为100%，并且父盒子要设置padding-left为左边盒子的margin-left相对应的正的数值.
尾部的p标签在屏幕宽度不够分两行显示的情况下文字不能居中显示

解决方法：负盒子不设高度，为了保证p标签上下留有空隙，可设margin-top和margin-bottom为相同的数值，同时p标签只设置行高即可
```
    <div class="copyright tac mt10 mb10 bgf5">
        <p class="fz14 lh20 c666">Copyright2012-2016 一起惠返利网             m178.hui.com 版权所有</p>
    </div>
```
css属性要写两个同样的同样的样式才生效

solution：这是因为自己在上一行css代码中最后加了一个分号，导致第一行代码不生效，
在用swiper类库做轮播图时，小圆点的默认样式是在图片里的，想要把小圆点放在图片外面

sulution:在放小圆点的div下面再放一个div，以撑开整个轮播图盒子，因为小圆点用的是绝对定位，并且加的div盒子是空白的，所以给小圆点div设置bottom属性就可以把div盒子移下来了。
关于c3选择器nth-child多选的问题

solution：选取前面的几个:nth-child(-n+b)

选取后面的几个: nth-child(n-b) b为要选取的个数
在字符串拼接中，数据渲染不出来

solution：一开始用的是html，这样是不行的，因为这样只会渲染最后一条数据，前面的数据都给覆盖了，要用append方法才行.
在做点击小火箭功能时，点击小火箭页面不以动画的形式滚动回顶部
- 错误代码
```
function toTop() {
    $(this).animate({'scrollTop':'0'}, 600);
}
```
- 正确代码
```
function toTop() {
    $('body').animate({'scrollTop':'0'}, 600);
}
```
- 原因分析：给小火箭绑定滚回页面顶部当然不行了，要给页面绑定滚回页面顶部事件才行

点击按钮显示隐藏密码输入框是否显示字符

function showPassword() {
    var password = $(".input-password");
    if (password.prop("type") == 'password') {
        password.prop('type','text')
    } else {
        password.prop('type','password')
        console.log(password.prop("type"));
    }
}

用jq的方法html不能给input标签设置文本值，

solution:单标签当然不能用html()方法，要用val()方法，
jq中用html()方法更改标签内的值时，里面的子标签消失不见了.

solution：这是因为html会把标签内所有的内容都当做文件节点来解析，所以里面的标签给设置的html内容替换了,所以当标签内含有其他内容时，不能用html(),应该用prepend()或者append()方法.
在ajax请求中无法请求到数据

solution: 在php文件中，从前台发送过来的数据应该用$user = $_POST['user'];，注意数据格式用对象.
还有一个，就是在php文件获取的是前台发送过来的json数据的。
发送ajax请求时，显示500 服务器内部错误

solution:这一般是php文件出问题了，没写对，仔细检查每一个细节.

不通过点击a链接，直接用js或者jq控制页面跳转

<!--JavaScript-->
window.location.href = "http://www.sitefinity.com";
<!--jQuery-->
$(location).attr('href', 'http://www.sitefinity.com');

html页面右边莫名出现空白，出现横向滚动条。

solution: 加上这条代码即可
```
html{     
    width:100%;    
    overflow-x:hidden;
}
```