blocks|key|1854144|text|您可以使用这个jQuery插件：https://github.com/mathiasbynens/jquery-placeholder|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1854145|但是你的链接似乎也是一个很好的解决方案。|1854146|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/mathiasbynens/jquery-placeholder^0|G|1F|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@$A|O|B|P|1|Q]]|C|$]]|$1|D|3|E|5|6|7|R|8|@]|9|@]|C|$]]|$1|F|3|-4|5|6|7|S|8|@]|9|@]|C|$]]]|G|$H|$5|I|J|K|C|$L|M]]]]

<p>You could use this jQuery plugin:
<a href="https://github.com/mathiasbynens/jquery-placeholder" rel="noreferrer">https://github.com/mathiasbynens/jquery-placeholder</a></p>

<p>But your link seems to be also a good solution.</p>


blocks|key|5204959|text|您可以使用以下任意一种多边形填充：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5204960|5204961|https://github.com/jamesallardice/Placeholders.js+(不支持密码fields)|unordered-list-item|offset|length|5204962|https://github.com/chemerisuk/better-placeholder-polyfill|5204963|5204964|这些脚本将在不支持placeholder属性的浏览器中添加对它的支持，并且它们不需要jQuery！|style|CODE|5204965|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/jamesallardice/Placeholders.js|1^0|0|0|0|1D|0|0|0|1L|1|0|0|9|B|0^^$0|@$1|2|3|4|5|6|7|X|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|C|3|D|5|E|7|Z|8|@]|9|@$F|10|G|11|1|12]]|A|$]]|$1|H|3|I|5|E|7|13|8|@]|9|@$F|14|G|15|1|16]]|A|$]]|$1|J|3|-4|5|6|7|17|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|18|8|@$F|19|G|1A|M|N]]|9|@]|A|$]]|$1|O|3|-4|5|6|7|1B|8|@]|9|@]|A|$]]]|P|$Q|$5|R|S|T|A|$U|V]]|W|$5|R|S|T|A|$U|I]]]]

<p>You can use any one of these polyfills:</p>

<ul>
<li><a href="https://github.com/jamesallardice/Placeholders.js" rel="nofollow noreferrer">https://github.com/jamesallardice/Placeholders.js</a> (doesn't support password fields)</li>
<li><a href="https://github.com/chemerisuk/better-placeholder-polyfill" rel="nofollow noreferrer">https://github.com/chemerisuk/better-placeholder-polyfill</a></li>
</ul>

<p>These scripts will add support for the <code>placeholder</code> attribute in browsers that do not support it, and they do not require jQuery!</p>


blocks|key|5688974|text|$.Browser.msie不再是最新的JQuery+...您必须使用$.support|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|5688975|如下所示：|5688976|+<script>

+++++(function+($)+{
+++++++++$.support.placeholder+=+('placeholder'+in+document.createElement('input'));
+++++})(jQuery);


+++++//fix+for+IE7+and+IE8
+++++$(function+()+{
+++++++++if+(!$.support.placeholder)+{
+++++++++++++$("[placeholder]").focus(function+()+{
+++++++++++++++++if+($(this).val()+==+$(this).attr("placeholder"))+$(this).val("");
+++++++++++++}).blur(function+()+{
+++++++++++++++++if+($(this).val()+==+"")+$(this).val($(this).attr("placeholder"));
+++++++++++++}).blur();

+++++++++++++$("[placeholder]").parents("form").submit(function+()+{
+++++++++++++++++$(this).find('[placeholder]').each(function()+{
+++++++++++++++++++++if+($(this).val()+==+$(this).attr("placeholder"))+{
+++++++++++++++++++++++++$(this).val("");
+++++++++++++++++++++}
+++++++++++++++++});
+++++++++++++});
+++++++++}
+++++});
+</script>|code-block|syntax|javascript|5688977|entityMap^0|0|E|Z|9|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]|$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|T|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|U|8|@]|D|@]|E|$K|L]]|$1|M|3|-4|5|6|7|V|8|@]|D|@]|E|$]]]|N|$]]

<p>the <strong>$.Browser.msie</strong> is not on the latest JQuery anymore... 
you have to use the <strong>$.support</strong></p>

<p>like below:</p>

<pre><code> &lt;script&gt;

     (function ($) {
         $.support.placeholder = ('placeholder' in document.createElement('input'));
     })(jQuery);


     //fix for IE7 and IE8
     $(function () {
         if (!$.support.placeholder) {
             $("[placeholder]").focus(function () {
                 if ($(this).val() == $(this).attr("placeholder")) $(this).val("");
             }).blur(function () {
                 if ($(this).val() == "") $(this).val($(this).attr("placeholder"));
             }).blur();

             $("[placeholder]").parents("form").submit(function () {
                 $(this).find('[placeholder]').each(function() {
                     if ($(this).val() == $(this).attr("placeholder")) {
                         $(this).val("");
                     }
                 });
             });
         }
     });
 &lt;/script&gt;
</code></pre>


blocks|key|691007|text|如果你使用jquery，你可以这样做。从此网站Placeholder+with+Jquery+|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|691008|$('[placeholder]').parents('form').submit(function()+{
++$(this).find('[placeholder]').each(function()+{
++++var+input+=+$(this);
++++if+(input.val()+==+input.attr('placeholder'))+{
++++++input.val('');
++++}
++})
});|code-block|syntax|javascript|691009|这些是备用链接|691010|691011|Placeholder+jquery+library|ordered-list-item|691012|HTML5+polyfills+--转到占位符部分|691013|691014|entityMap|0|LINK|mutability|MUTABLE|url|http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html|1|https://github.com/ginader/HTML5-placeholder-polyfill|2|https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills^0|N|O|0|0|0|0|0|0|Q|1|0|0|F|2|0|0^^$0|@$1|2|3|4|5|6|7|13|8|@]|9|@$A|14|B|15|1|16]]|C|$]]|$1|D|3|E|5|F|7|17|8|@]|9|@]|C|$G|H]]|$1|I|3|J|5|6|7|18|8|@]|9|@]|C|$]]|$1|K|3|-4|5|6|7|19|8|@]|9|@]|C|$]]|$1|L|3|M|5|N|7|1A|8|@]|9|@$A|1B|B|1C|1|1D]]|C|$]]|$1|O|3|P|5|N|7|1E|8|@]|9|@$A|1F|B|1G|1|1H]]|C|$]]|$1|Q|3|-4|5|6|7|1I|8|@]|9|@]|C|$]]|$1|R|3|-4|5|6|7|1J|8|@]|9|@]|C|$]]]|S|$T|$5|U|V|W|C|$X|Y]]|Z|$5|U|V|W|C|$X|10]]|11|$5|U|V|W|C|$X|12]]]]

<p>if you use jquery you can do like this.  from this site <a href="http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html" rel="nofollow">Placeholder with Jquery </a></p>

<pre><code>$('[placeholder]').parents('form').submit(function() {
  $(this).find('[placeholder]').each(function() {
    var input = $(this);
    if (input.val() == input.attr('placeholder')) {
      input.val('');
    }
  })
});
</code></pre>

<p>these are the alternate links </p>

<ol>
<li><a href="https://github.com/ginader/HTML5-placeholder-polyfill" rel="nofollow">Placeholder jquery library</a></li>
<li><a href="https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills" rel="nofollow">HTML5 polyfills</a> -- go for placeholder section </li>
</ol>


blocks|key|690815|text|我有几个插件的兼容性问题，对我来说，这似乎是支持文本输入占位符的最简单方法：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|690816|function+placeholders(){
++++//On+Focus
++++$(":text").focus(function(){
++++++++//Check+to+see+if+the+user+has+modified+the+input,+if+not+then+remove+the+placeholder+text
++++++++if($(this).val()+==+$(this).attr("placeholder")){
++++++++++++$(this).val("");
++++++++}
++++});

++++//On+Blur
++++$(":text").blur(function(){
++++++++//Check+to+see+if+the+use+has+modified+the+input,+if+not+then+populate+the+placeholder+back+into+the+input
++++++++if(+$(this).val()+==+""){
++++++++++++$(this).val($(this).attr("placeholder"));
++++++++}
++++});
}|code-block|syntax|javascript|690817|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>I had compatibility issues with several plugins I tried, this seems to me to be the simplest way of supporting placeholders on text inputs:</p>

<pre><code>function placeholders(){
    //On Focus
    $(":text").focus(function(){
        //Check to see if the user has modified the input, if not then remove the placeholder text
        if($(this).val() == $(this).attr("placeholder")){
            $(this).val("");
        }
    });

    //On Blur
    $(":text").blur(function(){
        //Check to see if the use has modified the input, if not then populate the placeholder back into the input
        if( $(this).val() == ""){
            $(this).val($(this).attr("placeholder"));
        }
    });
}
</code></pre>


blocks|key|5205161|text|$(function(){++++
++++if($.browser.msie+&&+$.browser.version+<=+9){
++++++++$("[placeholder]").focus(function(){
++++++++++++if($(this).val()==$(this).attr("placeholder"))+$(this).val("");
++++++++}).blur(function(){
++++++++++++if($(this).val()=="")+$(this).val($(this).attr("placeholder"));
++++++++}).blur();

++++++++$("[placeholder]").parents("form").submit(function()+{
++++++++++++$(this).find('[placeholder]').each(function()+{
++++++++++++++++if+($(this).val()+==+$(this).attr("placeholder"))+{
++++++++++++++++++++$(this).val("");
++++++++++++++++}
++++++++++++})
++++++++});
++++}
});|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|5205162|尝尝这个|unstyled|5205163|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|J|8|@]|9|@]|A|$]]|$1|G|3|-4|5|F|7|K|8|@]|9|@]|A|$]]]|H|$]]

<pre><code>$(function(){    
    if($.browser.msie &amp;&amp; $.browser.version &lt;= 9){
        $("[placeholder]").focus(function(){
            if($(this).val()==$(this).attr("placeholder")) $(this).val("");
        }).blur(function(){
            if($(this).val()=="") $(this).val($(this).attr("placeholder"));
        }).blur();

        $("[placeholder]").parents("form").submit(function() {
            $(this).find('[placeholder]').each(function() {
                if ($(this).val() == $(this).attr("placeholder")) {
                    $(this).val("");
                }
            })
        });
    }
});
</code></pre>

<p>try this</p>


blocks|key|5205142|text|我用这个，它只是Javascript。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5205143|我只有一个带有值的input元素，当用户单击input元素时，它会将其更改为没有值的input元素。|5205144|您可以使用CSS轻松更改文本的颜色。占位符的颜色是id+#IEinput中的颜色，您键入的文本的颜色是id+#email中的颜色。不要使用getElementsByClassName，因为IE的版本不支持占位符，也不支持getElementsByClassName！|offset|length|style|BOLD|5205145|通过将原始密码输入的类型设置为文本，可以在密码输入中使用占位符。|5205146|Tinker：http://tinker.io/4f7c5/1+-+JSfiddle服务器宕机了！|5205147|*为我糟糕的英语道歉|5205148|JAVASCRIPT|5205149|function+removeValue()+{
++++document.getElementById('mailcontainer')
++++++++.innerHTML+=+"<input+id=\"email\"+type=\"text\"+name=\"mail\">";
++++document.getElementById('email').focus();+}|code-block|syntax|javascript|5205150|HTML|5205151|<span+id="mailcontainer">
++++<input+id="IEinput"+onfocus="removeValue()"+type="text"+name="mail"+value="mail">
</span>|5205152|entityMap|0|LINK|mutability|MUTABLE|url|http://tinker.io/4f7c5/1^0|0|0|1T|2|0|0|7|O|0|0|0|0|A|0|0|0|4|0|0^^$0|@$1|2|3|4|5|6|7|18|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|19|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|1A|8|@$F|1B|G|1C|H|I]]|9|@]|A|$]]|$1|J|3|K|5|6|7|1D|8|@]|9|@]|A|$]]|$1|L|3|M|5|6|7|1E|8|@]|9|@$F|1F|G|1G|1|1H]]|A|$]]|$1|N|3|O|5|6|7|1I|8|@]|9|@]|A|$]]|$1|P|3|Q|5|6|7|1J|8|@$F|1K|G|1L|H|I]]|9|@]|A|$]]|$1|R|3|S|5|T|7|1M|8|@]|9|@]|A|$U|V]]|$1|W|3|X|5|6|7|1N|8|@$F|1O|G|1P|H|I]]|9|@]|A|$]]|$1|Y|3|Z|5|T|7|1Q|8|@]|9|@]|A|$U|V]]|$1|10|3|-4|5|6|7|1R|8|@]|9|@]|A|$]]]|11|$12|$5|13|14|15|A|$16|17]]]]

<p>I use thisone, it's only Javascript.</p>

<p>I simply have an input element with a value, and when the user clicks on the input element, it changes it to an input element without a value. </p>

<p>You can easily change the color of the text using CSS. The color of the placeholder is the color in the id #IEinput, and the color your typed text will be is the color in the id #email. <strong>Don't</strong> use getElementsByClassName, because the versions of IE that don't support a placeholder, don't support getElementsByClassName either!</p>

<p>You can use a placeholder in a password input by setting the type of the original password input to text.</p>

<p>Tinker: <a href="http://tinker.io/4f7c5/1" rel="nofollow">http://tinker.io/4f7c5/1</a>
 - JSfiddle servers are down!</p>

<p>*sorry for my bad english</p>

<p><strong>JAVASCRIPT</strong></p>

<pre><code>function removeValue() {
    document.getElementById('mailcontainer')
        .innerHTML = "&lt;input id=\"email\" type=\"text\" name=\"mail\"&gt;";
    document.getElementById('email').focus(); }
</code></pre>

<p><strong>HTML</strong></p>

<pre><code>&lt;span id="mailcontainer"&gt;
    &lt;input id="IEinput" onfocus="removeValue()" type="text" name="mail" value="mail"&gt;
&lt;/span&gt;
</code></pre>


blocks|key|5205532|text|对于其他登陆这里的人来说。这是对我有效的方法：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5205533|//jquery+polyfill+for+showing+place+holders+in+IE9
$('[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()+==+''+%7C%7C+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('');
++++++++}
++++})
});|code-block|syntax|javascript|5205534|只需将此代码添加到script.js文件中即可。由http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html提供|offset|length|5205535|entityMap|0|LINK|mutability|MUTABLE|url|http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html^0|0|0|P|24|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@$I|V|J|W|1|X]]|A|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|R]]]]

<p>For others landing here. This is what worked for me:</p>

<pre><code>//jquery polyfill for showing place holders in IE9
$('[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('');
        }
    })
});
</code></pre>

<p>Just add this in you script.js file.
Courtesy of <a href="http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html" rel="nofollow noreferrer">http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html</a></p>


blocks|key|5688994|text|由于大多数解决方案都使用jQuery，或者并不像我希望的那样令人满意，因此我为自己为mootools编写了一个代码片段。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5688995|function+fix_placeholder(container){
++++if(container+==+null)+container+=+document.body;

++++if(!('placeholder'+in+document.createElement('input'))){

++++++++var+inputs+=+container.getElements('input');
++++++++Array.each(inputs,+function(input){

++++++++++++var+type+=+input.get('type');

++++++++++++if(type+==+'text'+%7C%7C+type+==+'password'){

++++++++++++++++var+placeholder+=+input.get('placeholder');
++++++++++++++++input.set('value',+placeholder);
++++++++++++++++input.addClass('__placeholder');

++++++++++++++++if(!input.hasEvent('focus',+placeholder_focus)){
++++++++++++++++++++input.addEvent('focus',+placeholder_focus);
++++++++++++++++}

++++++++++++++++if(!input.hasEvent('blur',+placeholder_blur)){
++++++++++++++++++++input.addEvent('blur',+placeholder_blur);
++++++++++++++++}

++++++++++++}

++++++++});

++++}
}

function+placeholder_focus(){

++++var+input+=+$(this);++++

++++if(input.get('class').contains('__placeholder')+%7C%7C+input.get('value')+==+''){
++++++++input.removeClass('__placeholder');
++++++++input.set('value',+'');
++++}

}

function+placeholder_blur(){

++++var+input+=+$(this);++++

++++if(input.get('value')+==+''){
++++++++input.addClass('__placeholder');
++++++++input.set('value',+input.get('placeholder'));
++++}

}|code-block|syntax|javascript|5688996|我承认它看起来比其他的要多一点，但它工作得很好。__placeholder是一个ccs类，可以使占位符文本的颜色更加美观。|offset|length|style|BOLD|5688997|我在window.addEvent中使用了fix_placeholder+(‘domready’，...和任何额外添加的代码，比如弹出窗口。|5688998|希望你会喜欢。|5688999|致以亲切的问候。|5689000|entityMap^0|0|0|O|D|0|2|1E|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|W|8|@$I|X|J|Y|K|L]]|9|@]|A|$]]|$1|M|3|N|5|6|7|Z|8|@$I|10|J|11|K|L]]|9|@]|A|$]]|$1|O|3|P|5|6|7|12|8|@]|9|@]|A|$]]|$1|Q|3|R|5|6|7|13|8|@]|9|@]|A|$]]|$1|S|3|-4|5|6|7|14|8|@]|9|@]|A|$]]]|T|$]]

<p>Since most solutions uses jQuery or are not this satisfying as I wished it to be I wrote a snippet for myself for mootools.</p>

<pre><code>function fix_placeholder(container){
    if(container == null) container = document.body;

    if(!('placeholder' in document.createElement('input'))){

        var inputs = container.getElements('input');
        Array.each(inputs, function(input){

            var type = input.get('type');

            if(type == 'text' || type == 'password'){

                var placeholder = input.get('placeholder');
                input.set('value', placeholder);
                input.addClass('__placeholder');

                if(!input.hasEvent('focus', placeholder_focus)){
                    input.addEvent('focus', placeholder_focus);
                }

                if(!input.hasEvent('blur', placeholder_blur)){
                    input.addEvent('blur', placeholder_blur);
                }

            }

        });

    }
}

function placeholder_focus(){

    var input = $(this);    

    if(input.get('class').contains('__placeholder') || input.get('value') == ''){
        input.removeClass('__placeholder');
        input.set('value', '');
    }

}

function placeholder_blur(){

    var input = $(this);    

    if(input.get('value') == ''){
        input.addClass('__placeholder');
        input.set('value', input.get('placeholder'));
    }

}
</code></pre>

<p>I confess that it looks a bit more MORE than others but it works fine.
<strong>__placeholder</strong> is a ccs-class to make the color of the placeholder text fancy.</p>

<p>I used the <strong>fix_placeholder</strong> in <strong>window.addEvent('domready', ...</strong> and for any additinally added code like popups.</p>

<p>Hope you like it.</p>

<p>Kind regards.</p>


blocks|key|691242|text|我使用了这个链接http://dipaksblogonline.blogspot.com/2012/02/html5-placeholder-in-ie7-and-ie8-fixed.html的代码|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|691243|但在浏览器检测中，我使用了：|691244|if+(navigator.userAgent.indexOf('MSIE')+>+-1)+{
+//Your+placeholder+support+code+here...
}|code-block|syntax|javascript|691245|entityMap|0|LINK|mutability|MUTABLE|url|http://dipaksblogonline.blogspot.com/2012/02/html5-placeholder-in-ie7-and-ie8-fixed.html^0|8|2G|0|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@$A|T|B|U|1|V]]|C|$]]|$1|D|3|E|5|6|7|W|8|@]|9|@]|C|$]]|$1|F|3|G|5|H|7|X|8|@]|9|@]|C|$I|J]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|C|$]]]|L|$M|$5|N|O|P|C|$Q|R]]]]

<p>I used the code of this link 
<a href="http://dipaksblogonline.blogspot.com/2012/02/html5-placeholder-in-ie7-and-ie8-fixed.html" rel="nofollow" title="http://dipaksblogonline.blogspot.com/2012/02/html5-placeholder-in-ie7-and-ie8-fixed.html">http://dipaksblogonline.blogspot.com/2012/02/html5-placeholder-in-ie7-and-ie8-fixed.html</a></p>

<p>But in browser detection I used:</p>

<pre><code>if (navigator.userAgent.indexOf('MSIE') &gt; -1) {
 //Your placeholder support code here...
}
</code></pre>


blocks|key|5689200|text|<input+type="text"+name="Name"+value="Name"+onfocus="this.value+=+''"+onblur="+if(this.value+=+'')+{+value+=+'Name'}"+/>|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|5689201|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>&lt;input type="text" name="Name" value="Name" onfocus="this.value = ''" onblur=" if(this.value = '') { value = 'Name'}" /&gt;
</code></pre>


blocks|key|1854658|text|添加下面的代码就可以了。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1854659|<script+src="https://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
++++<script+src="https://code.google.com/p/jquery-placeholder-js/source/browse/trunk/jquery.placeholder.1.3.min.js?r=6"></script>
++++<script+type="text/javascript">
++++++++//+Mock+client+code+for+testing+purpose
++++++++$(function(){
++++++++++++//+Client+should+be+able+to+add+another+change+event+to+the+textfield
++++++++++++$("input[name='input1']").blur(function(){+alert("Custom+event+triggered.");+});++++
++++++++++++//+Client+should+be+able+to+set+the+field's+styles,+without+affecting+place+holder
++++++++++++$("textarea[name='input4']").css("color",+"red");

++++++++++++//+Initialize+placeholder
++++++++++++$.Placeholder.init();

++++++++++++//+or+try+initialize+with+parameter
++++++++++++//$.Placeholder.init({+color+:+'rgb(255,+255,+0)'+});

++++++++++++//+call+this+before+form+submit+if+you+are+submitting+by+JS
++++++++++++//$.Placeholder.cleanBeforeSubmit();
++++++++});
++++</script>|code-block|syntax|javascript|1854660|从https://code.google.com/p/jquery-placeholder-js/downloads/detail?name=jquery.placeholder.1.3.zip下载完整代码和演示|offset|length|1854661|entityMap|0|LINK|mutability|MUTABLE|url|https://code.google.com/p/jquery-placeholder-js/downloads/detail?name=jquery.placeholder.1.3.zip^0|0|0|1|2O|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@$I|V|J|W|1|X]]|A|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|R]]]]

<p>Add the below code and it will be done. </p>

<pre><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"&gt;&lt;/script&gt;
    &lt;script src="https://code.google.com/p/jquery-placeholder-js/source/browse/trunk/jquery.placeholder.1.3.min.js?r=6"&gt;&lt;/script&gt;
    &lt;script type="text/javascript"&gt;
        // Mock client code for testing purpose
        $(function(){
            // Client should be able to add another change event to the textfield
            $("input[name='input1']").blur(function(){ alert("Custom event triggered."); });    
            // Client should be able to set the field's styles, without affecting place holder
            $("textarea[name='input4']").css("color", "red");

            // Initialize placeholder
            $.Placeholder.init();

            // or try initialize with parameter
            //$.Placeholder.init({ color : 'rgb(255, 255, 0)' });

            // call this before form submit if you are submitting by JS
            //$.Placeholder.cleanBeforeSubmit();
        });
    &lt;/script&gt;
</code></pre>

<p>Download the full code and demo from <a href="https://code.google.com/p/jquery-placeholder-js/downloads/detail?name=jquery.placeholder.1.3.zip" rel="nofollow">https://code.google.com/p/jquery-placeholder-js/downloads/detail?name=jquery.placeholder.1.3.zip</a></p>


blocks|key|691287|text|以下是一个javascript函数，它将为IE+8及更低版本创建占位符，它也适用于密码：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|691288|​|691289|/*+Function+to+add+placeholders+to+form+elements+on+IE+8+and+below+*/
function+add_placeholders(fm)+{	
	for+(var+e+=+0;+e+<+document.fm.elements.length;+e%2B%2B)+{
		if+(fm.elements[e].placeholder+!=+undefined+&&
		document.createElement("input").placeholder+==+undefined)+{+//+IE+8+and+below					
			fm.elements[e].style.background+=+"transparent";
			var+el+=+document.createElement("span");
			el.innerHTML+=+fm.elements[e].placeholder;
			el.style.position+=+"absolute";
			el.style.padding+=+"2px;";
			el.style.zIndex+=+"-1";
			el.style.color+=+"#999999";
			fm.elements[e].parentNode.insertBefore(el,+fm.elements[e]);
			fm.elements[e].onfocus+=+function()+{
					this.style.background+=+"yellow";	
			}
			fm.elements[e].onblur+=+function()+{
				if+(this.value+==+"")+this.style.background+=+"transparent";
				else+this.style.background+=+"white";	
			}		
		}+
	}
}

add_placeholders(document.getElementById('fm'))|code-block|syntax|javascript|691290|<form+id="fm">
++<input+type="text"+name="email"+placeholder="Email">
++<input+type="password"+name="password"+placeholder="Password">
++<textarea+name="description"+placeholder="Description"></textarea>
</form>|691291|691292|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|P|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|K|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|M|$]]

<p>Here is a javascript function that will create placeholders for IE 8 and below and it works for passwords as well:</p>

<p><div class="snippet" data-lang="js" data-hide="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>/* Function to add placeholders to form elements on IE 8 and below */
function add_placeholders(fm) {	
	for (var e = 0; e &lt; document.fm.elements.length; e++) {
		if (fm.elements[e].placeholder != undefined &amp;&amp;
		document.createElement("input").placeholder == undefined) { // IE 8 and below					
			fm.elements[e].style.background = "transparent";
			var el = document.createElement("span");
			el.innerHTML = fm.elements[e].placeholder;
			el.style.position = "absolute";
			el.style.padding = "2px;";
			el.style.zIndex = "-1";
			el.style.color = "#999999";
			fm.elements[e].parentNode.insertBefore(el, fm.elements[e]);
			fm.elements[e].onfocus = function() {
					this.style.background = "yellow";	
			}
			fm.elements[e].onblur = function() {
				if (this.value == "") this.style.background = "transparent";
				else this.style.background = "white";	
			}		
		} 
	}
}

add_placeholders(document.getElementById('fm'))</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;form id="fm"&gt;
  &lt;input type="text" name="email" placeholder="Email"&gt;
  &lt;input type="password" name="password" placeholder="Password"&gt;
  &lt;textarea name="description" placeholder="Description"&gt;&lt;/textarea&gt;
&lt;/form&gt;</code></pre>
</div>
</div>
</p>


blocks|key|690700|text|++++<script>
++++++++if+($.browser.msie)+{
++++++++++++$('input[placeholder]').each(function()+{

++++++++++++++++var+input+=+$(this);

++++++++++++++++$(input).val(input.attr('placeholder'));

++++++++++++++++$(input).focus(function()+{
++++++++++++++++++++if+(input.val()+==+input.attr('placeholder'))+{
++++++++++++++++++++++++input.val('');
++++++++++++++++++++}
++++++++++++++++});

++++++++++++++++$(input).blur(function()+{
++++++++++++++++++++if+(input.val()+==+''+%7C%7C+input.val()+==+input.attr('placeholder'))+{
++++++++++++++++++++++++input.val(input.attr('placeholder'));
++++++++++++++++++++}
++++++++++++++++});
++++++++++++});
++++++++}
++++++++;
++++</script>|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|690701|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>    &lt;script&gt;
        if ($.browser.msie) {
            $('input[placeholder]').each(function() {

                var input = $(this);

                $(input).val(input.attr('placeholder'));

                $(input).focus(function() {
                    if (input.val() == input.attr('placeholder')) {
                        input.val('');
                    }
                });

                $(input).blur(function() {
                    if (input.val() == '' || input.val() == input.attr('placeholder')) {
                        input.val(input.attr('placeholder'));
                    }
                });
            });
        }
        ;
    &lt;/script&gt;
</code></pre>


<p>I have a small issue, the <code>placeholder</code> attribute for input boxes is not supported in IE 8-9.</p>

<p>What is the best way to make this support in my project (ASP Net). I am using jQuery.
Need I use some other external tools for it?</p>

<p>Is <a href="http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html" rel="noreferrer">http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html</a> a good solution?</p>


How to support placeholder attribute in IE8 and 9

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我有一个小问题，IE 8-9不支持输入框的placeholder属性。在我的项目(ASP.NET)中提供这种支持的最好方法是什么？我正在使用jQuery。我需要使用一些其他的外部工具吗？是一个好的解决方案吗？

问如何在IE8和9中支持占位符属性
EN

回答 14

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在IE8和9中支持占位符属性EN

回答 14

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在IE8和9中支持占位符属性
EN