一、
input常用在表单的输入，包括text，password，H5后又新增了许多type属性值，如url, email, member等等，考虑到非现代浏览器的兼容性问题，这些新的type常用在移动端的项目中。
二、
IE10+浏览器下，input标签会有一个默认的样式，比如文本框的‘×’号，密码框的小眼睛。初衷是好的，有时候很方便，但有时候我们会自己设置样式和功能。可以用伪元素方法去除：
::-ms-clear, ::-ms-reveal{display: none;}三、
在低版本的IE下，input中的文字位置会改变（偏上显示），解决方法：（思路： 设置input的高度=行高）
input { height: 60px; line-height: 60px; margin: 0; padding: 0; outline: none; }四、
实际中，我们会在input的前面用label标签或其他，提示input的内容信息。在IE下，在获得焦点、失去焦点时，label标签里的文字会出现抖动问题。解决方法：（设置input的显示方式为行内块）
input { display: inline-block; }五、
##placeholder是H5的一个新属性，但是在IE9以下是不支持的，为此我们会封装一个函数进行能力检测。
参考地址：http://www.studyofnet.com/news/1022.html
###以下是代码部分：
$(function() { // 如果不支持placeholder，用jQuery来完成 if(!isSupportPlaceholder()) { // 遍历所有input对象, 除了密码框 $('input').not("input[type='password']").each( function() { var self = $(this); var val = self.attr("placeholder"); input(self, val); } );
/** * 对password框的特殊处理 * 1.创建一个text框 * 2.获取焦点和失去焦点的时候切换 */ $('input[type="password"]').each( function() { var pwdField = $(this); var pwdVal = pwdField.attr('placeholder'); var pwdId = pwdField.attr('id'); // 重命名该input的id为原id后跟1 pwdField.after('<input id="' + pwdId +'1" type="text" value='+pwdVal+' autocomplete="off" />'); var pwdPlaceholder = $('#' + pwdId + '1'); pwdPlaceholder.show(); pwdField.hide(); pwdPlaceholder.focus(function(){ pwdPlaceholder.hide(); pwdField.show(); pwdField.focus(); }); pwdField.blur(function(){ if(pwdField.val() == '') { pwdPlaceholder.show(); pwdField.hide(); } }); } ); } }); // 判断浏览器是否支持placeholder属性 function isSupportPlaceholder() { var input = document.createElement('input'); return 'placeholder' in input; } // jQuery替换placeholder的处理 function input(obj, val) { var $input = obj; var val = val; $input.attr({value:val}); $input.focus(function() { if ($input.val() == val) { $(this).attr({value:""}); } }).blur(function() { if ($input.val() == "") { $(this).attr({value:val}); } }); }
