【问题标题】:Placeholder attribute not working in internet explorer占位符属性在 Internet Explorer 中不起作用
【发布时间】:2013-02-27 18:57:12
【问题描述】:

internet explorer 中占位符不工作的解决方法如下,结合使用javascript和jquery。

我必须重复一下,对于占位符在 Internet Explorer 中不起作用的问题的解决方案如下,使用 javascript 和 jquery 的组合。

    //DETERMINE BROWSER TYPE
    var browser='';
    jQuery.each(jQuery.browser, function(i, val) {
        if(i=='msie')browser=i;
    });

    if(browser=='msie'){
        var password = '<input type="text" value="Password" placeholder="Password" name="q22" class="form-gen-element" id="ie-password-holder" />';

        $(password)
        .insertAfter($('input[name="q2"]'));

        $('input[name="q2"]')
        .hide();

        //INTERNET EXPLORER PLACEHOLDER FIX
        $('#login-content')
        .find('.form-gen-element')
        .focus(function(){
            if($(this).val()==$(this).attr('placeholder')){
                //Move cursor position
                if ($(this).get(0).setSelectionRange) {
                  $(this).get(0).setSelectionRange(0, 0);
                } else if ($(this).get(0).createTextRange) {
                  var range = $(this).get(0).createTextRange();
                  range.collapse(true);
                  range.moveEnd('character', 0);
                  range.moveStart('character', 0);
                  range.select();
                }
            }
        })
        .blur(function(){
            if($(this).val()==''){
                $(this).val($(this).attr('placeholder'));

                if($(this).attr('name')=='q2')
                    $(this).attr('type','text');
            }
        })
        .keydown(function(e){
            if($(this).val()==$(this).attr('placeholder')){
                if((e.keyCode > 47 && e.keyCode < 91) || e.keyCode==109 || e.keyCode==110 || e.keyCode==190 || e.keyCode==110){
                    var t = $(this).val().split($(this).attr('placeholder'));
                    $(this).val(t[0]);

                    //Handle password attribute change
                    if($(this).attr('name')=='q22'){
                        $(this).attr('type','password');
                    }
                }
            }
        });

    }else{
        //OTHER BROWSERS DEFAULT FUNCTIONALITY
        $('#login-content')
        .find('.form-gen-element')
        .val('');
    }
});

【问题讨论】:

    标签: javascript internet-explorer placeholder


    【解决方案1】:

    查看下面关于 SO
    Input placeholders for Internet Explorer 的有用问题

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2012-01-27
      • 2013-05-05
      • 2013-08-12
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-01-06
      相关资源
      最近更新 更多