占位符未显示

时间:2017-04-15 20:53:15

标签: html css web placeholder

伙计们我已经在这里阅读了有关该主题的所有内容,但我仍然无法弄清楚为什么我的占位符没有显示出来。希望你能分享你的专业知识并告诉我我做错了什么。

<input type="text" name="search" class="input-block-level search-query" placeholder="Enter your name" required="">

它只是没有出现在任何浏览器中。谢谢你提前!

2 个答案:

答案 0 :(得分:0)

您可以尝试将此代码用于此输入上的占位符节目。

&#13;
&#13;
$(document).ready(function() {
    function add() {if($(this).val() == ''){$(this).val($(this).attr('placeholder')).addClass('placeholder');}}
    function remove() {if($(this).val() == $(this).attr('placeholder')){$(this).val('').removeClass('placeholder');}}
    if (!('placeholder' in $('<input>')[0])) { 
        $('input[placeholder]').blur(add).focus(remove).each(add);
        $('div').submit(function(){$(this).find('input[placeholder]').each(remove);}); 
    }
});
&#13;
<div>
<input type="text" name="search" class="input-block-level search-query" placeholder="Enter your name" required>
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:-1)

我找到了这个链接,这将使我们对如何解决占位符问题有一个很好的了解,它将使用jquery,这将是一个很好的解决方案。 http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html 这是完整的jquery代码 //根据MIT许可证发布:http://www.opensource.org/licenses/mit-license.php

$('[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().parents('form').submit(function() {
$(this).find('[placeholder]').each(function() {
var input = $(this);
if (input.val() == input.attr('placeholder')) {
input.val('');
}
})
});