IE9版本的浏览器对placeholder的兼容,封装函数

银叶果

于 2021-08-12 15:46:18 发布

阅读量108

点赞数

文章标签：封装

本文链接：https://blog.csdn.net/m0_53328982/article/details/119646135

版权

该博客提供了一个JavaScript函数，用于在IE9中实现对input元素placeholder属性的兼容性处理。通过监听input框的focus和blur事件，当输入框获得焦点时清空默认文本，失去焦点且内容为空或等于默认文本时恢复默认文本，从而达到类似placeholder的效果。

摘要由CSDN通过智能技术生成

IE9版本的浏览器对placeholder的兼容,封装函数

// IE9版本的浏览器对placeholder的兼容,封装函数，需要的时候直接在页面调用
// placeholder(".ipt")  .ipt是input框的class名

import $ from 'jquery'

let placeholder=(target)=>{
  $(target).val($(target).attr("datavalue")).addClass("inp");
  $(target).focus(function() {
    if($(this).val() == $(this).attr("datavalue")) {
      $(this).val("").removeClass("inp");
    }
  })
  $(target).blur(function(){
    if($(this).val() == "" || $(this).val() == $(this).attr("datavalue")) {
      $(this).val($(target).attr("datavalue")).addClass("inp");
    }
  })
}
export default placeholder