zoukankan      html  css  js  c++  java
  • Placeholder cross browsers

    HTML5的placeholder属性无非只是一个补缺的功能。那些IE9-都要使用JS去模拟,网上也有不少插件,但是发现在IE中,这些版本都有一些问题。无意中到了一个JQ写的,没有写成插件,反正考虑到了这一点。

    $(document).ready(function(){
    
    // var supportPlaceholder = 'placeholder' in document.createElement('input');
    if(!Modernizr.input.placeholder){ 
    //这里不使用Modernizr可以使用原生写法
    //if(!supportPlaceholder){
        $('[placeholder]').focus(function() {
          var input = $(this);
          if (input.val() == input.attr('placeholder')) {
            input.val('');
            input.removeClass('placeholder');
          }
        }).blur(function() {
          var input = $(this);
          if (input.val() == '' || input.val() == input.attr('placeholder')) {
            input.addClass('placeholder');
            input.val(input.attr('placeholder'));
          }
        }).blur();
        $('[placeholder]').parents('form').submit(function() {
          $(this).find('[placeholder]').each(function() {
            var input = $(this);
            if (input.val() == input.attr('placeholder')) {
              input.val('');
            }
          })
        });
    
    }
    
    });

    我提到的缺点就是,IE中会把placeholder的值提交,所以表单提交就会出错。这里后面的一段function正是去了这个一个值。

    我的博客: moc.recilooc.www =>'www.coolicer.com'.split('').reverse().join('') 

     

  • 相关阅读:
    445port入侵具体解释
    重构摘要12_大型重构
    Matlab画图-非常具体,非常全面
    期望DP
    自己实现一个SQL解析引擎
    信息熵(Entropy)究竟是用来衡量什么的?
    速算123,公布
    OCP-1Z0-051-题目解析-第28题
    选择排序
    Android入门第八篇之GridView(九宫图)
  • 原文地址:https://www.cnblogs.com/coolicer/p/2780442.html
Copyright © 2011-2022 走看看