input placeholder 兼容问题

Posted 2020-10-06 whkl梅

placeholder是html5出的新特性，ie9以下是不兼容的，

那么为了兼容ie9  我们需要对他做处理

//jq的处理方式
$(function(){
    jQuery(‘[placeholder]‘).focus(function() {
      var input = jQuery(this);
      if (input.val() == input.attr(‘placeholder‘)) {
        input.val(‘‘);
        input.removeClass(‘placeholder‘);
      }
    }).blur(function() {
      var input = jQuery(this);
      if (input.val() == ‘‘ || input.val() == input.attr(‘placeholder‘)) {
        input.addClass(‘placeholder‘);
        input.val(input.attr(‘placeholder‘));
      }
    }).blur().parents(‘form‘).submit(function() {
      jQuery(this).find(‘[placeholder]‘).each(function() {
        var input = jQuery(this);
        if (input.val() == input.attr(‘placeholder‘)) {
          input.val(‘‘);
        }
      })
    });
    console.log($(‘input‘))
})

这是jq的处理方式是把 input的 val 值设置和placeholder的值一样，然后通过获取焦点，失去焦点来判断val的值，最重要的是表单提交的时候，必须把val值判断一遍，如果val值还和placeholder的值一样，证明没修改过，提交前必须把val值置空。