html 问题

1、footer处理

目标：

页面较短，footer位于页面底部，出现滚动条时，依然在原来的位置，不随滚动条移动

页面较长，位于元素底部

.container{
    position: relative
}
.footer{
    position: absolute;
    bottom: 0
}

var w_h = window.screen.height;
var c_h = $('.container').height();
if(c_h > w_h){
    $('.footer').css('position', 'static');
 }else{
  $('.container').css('height', $(document).innerHeight());
}
// 要使用$(document).innerHeight()，而不能用window.screen.Height

2、form enter

场景：form中有一个input，input添加了change事件，输入内容后，enter，页面刷新。想要的效果是，输入内容后，enter，触发change事件。

解决办法：在form中添加一个隐藏的input。

原因：浏览器默认的几个原则

如果表单里有一个type=”submit”的按钮，回车键生效。

如果表单里只有一个type=”text”的input，不管按钮是什么type，回车键生效。

如果按钮不是用input，而是用button，并且没有加type，IE下默认为type=button，FX默认为type=submit。

其他表单元素如textarea、select不影响，radio checkbox不影响触发规则，但本身在FX下会响应回车键，在IE下不响应。 type=”image”的input，效果等同于type=”submit”，不知道为什么会设计这样一种type，不推荐使用，应该用CSS添加背景图合适些。

3、html5 a href支持的内容：https://, ftp://, mailto:, file:, tel:。

4、行内元素一般会有4px的间距，设置font-size:0，可以消除这个间距。inline or inline-block 都会有这个问题。

5、给图片添加热点区域，example中有。坐标是相对于图片本身的。

6、html5 的 text, search, url, telephone, email 以及 password 有一个新属性pattern title可以写正则，来更好的验证

7、iphone自动识别长串数字转换为a标签类型，解决办法加meta标签 telephone=no

8、a标签 直接下载文件

<a href='../data/test.pdf' download="" target='_black'>下载</a>

9、form提交数据 未知错误

可能是因为没有加enctype='multipart/form-data'