判断浏览器是否支持placeholder属性

//判断浏览器是否支持placeholder属性
function isSupportPlaceholder() {
    var input = document.createElement('input');
    return 'placeholder' in input;
}

如果支持,返回true,否认在false;

运用:

// 如果不支持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();
	                    }
	                });
	            }
	        );
	    }

猜你喜欢

转载自blog.csdn.net/stone10086/article/details/83105348