占位符未在IE9中显示

时间:2013-03-09 22:00:05

标签: javascript jquery html css css3

IE9浏览器中没有出现placeholder ...
在下面提供我的代码...... 你需要为ie9

编写任何jquery或css hack

http://defie.co/contact.html

<div class="span6">
    <i class="bookmarkingContact"></i>
    <h3 style="margin-bottom: 22px;">Inquiry</h3>

    <input class="span2" type="text" name="email" placeholder="User Name">
    <input class="span2" type="text" name="email" placeholder="Company">
    <input class="span2" type="text" name="email" placeholder="Email">
    <input class="span2" type="text" name="email" placeholder="Password">
    <a href="#" style="position: relative; top: 13px;">Sign Up</a>
</div>

3 个答案:

答案 0 :(得分:5)

  

占位符未出现在ie9浏览器中

IE&lt; 10不支持HTML5 placeholder属性。

Quircksmode

答案 1 :(得分:1)

Internet Explorer 9及更早版本不支持input标记的占位符属性。因此,要么使用Javascript来模拟效果,要么在输入旁边添加标签,要么忘记IE。

答案 2 :(得分:0)

IE9不支持它。我尝试在IE9中创建相同的效果,我写了一个JavaScript函数来检查是否支持placehoder。如果不是,那么通过jQuery ...

在表单元素字段中显示文本
/*AN HTML5 INPUT ATTRIBUTE THATS REALLY COOL*/
var placeHolderSupport = ('placeholder' in document.createElement('input'));

/*IF PLACEHOLDER IS NOT SUPPORTED...*/
if(!placeHolderSupport) {

/*GET THE ID OF EACH FORM ELEMENT*/
fname       = $('#fname');
femail      = $('#femail');
furl        = $('#furl');
fcomment    = $('#fcomment');
fsubmit     = $('#sendbtn');

/*DEFINE DEFAULT VALUES FOR EACH INPUT FIELD*/
fnameval    = "Your Full Name";
femailval   = "Your E-mail Address - (It will not be shared!)";
furlval     = "Your Web Site";
fcommentval = "Your Message";



        /*ASSOCIATE THE DEFAULT VALUES TO THE FORM INPUT FIELDS*/
        fname.val(fnameval);
        femail.val(femailval);
        furl.val(furlval);
        fcomment.val(fcommentval);

        /*CYCLE THROUGH EACH INPUT FIELD TO...*/
            $.each([
            {selector: fname,   mvalue: fnameval},
            {selector: femail,  mvalue: femailval},
            //{selector: furl,    mvalue: furlval},
            {selector: fcomment,mvalue: fcommentval}
            ],function(i, obj) {

              /*...SHOW OR HIDE DEFAULT VALUES*/
                obj.selector.focus(function() {
                    if(this.value == obj.mvalue) { this.value = ''; };
                }).blur(function() {    
                    if(!this.value) { this.value = obj.mvalue;};
                });
    }