占位符不起作用

占位符不能在IE-9中工作，所以我使用下面的代码来占位符。占位符不起作用

jQuery(function() { 
    debugger; 
    jQuery.support.placeholder = false; 
    test = document.createElement('input'); 
    if ('placeholder' in test) jQuery.support.placeholder = true; 
}); 
// This adds placeholder support to browsers that wouldn't otherwise support it. 
$(function() { 

    if (!$.support.placeholder) { 
     var active = document.activeElement; 
     $(':text').focus(function() { 
      if ($(this).attr('placeholder') != '' && $(this).val() == $(this).attr('placeholder')) { 
       $(this).val('').removeClass('hasPlaceholder'); 
      } 
     }).blur(function() { 
      if ($(this).attr('placeholder') != '' && ($(this).val() == '' || $(this).val() == $(this).attr('placeholder'))) { 
       $(this).val($(this).attr('placeholder')).addClass('hasPlaceholder'); 
      } 
     }); 
     $(':text').blur(); 
     $(active).focus(); 
     $('form:eq(0)').submit(function() { 
      $(':text.hasPlaceholder').val(''); 
     }); 
    } 
});

当我服用测试的价值，它表明我null.How可以得到所有输入标签的细节？

来源

2013-08-28 Niths

占位符属性将不支持低于IE 10 –

@Deepu貌似OP知道，并试图实现一种变通方法... – Teemu

@Deepu OP的代码是“占位符”支持的一个垫脚... –

我认为这将有助于你

if ($.browser.msie) { 
        $("input").each(function() { 
         if (IsNull($(this).val()) && $(this).attr("placeholder") != "") { 
          $(this).val($(this).attr("placeholder")).addClass('hasPlaceHolder'); 
          $(this).keypress(function() { 
           if ($(this).hasClass('hasPlaceHolder')) $(this).val("").removeClass('hasPlaceHolder'); 
          }); 
          $(this).blur(function() { 
           if ($(this).val() == "") $(this).val($(this).attr("placeholder")).addClass('hasPlaceHolder'); 
          }); 
         } 
        }); 
       }

来源

2013-08-30 05:05:58 user2156088

-3

HTML：

<input type='text' id='your_field' value='Enter value'/>

的jQuery：

$(document).ready(function(){ 
    $("#your_field").on('focusout',function(){ 
     if($("#your_field").val() == ''){ 
      $("#your_field").val('Enter value'); 
     } 
    }); 
    $("#your_field").on('focus',function(){ 
     if($("#your_field").val() == 'Enter value'){ 
      $("#your_field").val(''); 
     } 
    }); 
});

见DEMO

还要检查时的形式发布，因为如果用户提交表单，而无需输入字段，则Enter value会作为字段的值发布。因此，在提交表单时，请在客户端进行验证或在服务器端进行检查。

来源

2013-08-28 12:00:47

downvotters可以检查演示。 –

我输入“输入值”并单击文本框，我的文本消失。 – Doorknob

这种方法的可怕之处在于，如果用户提交表单时未修改假占位符值，则它将使用默认数据提交它，而不像占位符将提交空值。你应该指出，因为新手可能会使用你的100％完全有效的代码，但仍然无法弄清楚为什么占位符文本有时会发布在他们的表单上！ –

我在我的手机，所以这是很难，但真的是你需要做的

JQuery.support.placeholder = typeof 'placeholder' in test !== 'undefined'

因为空意味着没有任何占位符值，但有占位符支持

从我理解你的意思是说测试中的占位符返回null

来源

2013-08-28 12:07:03 iConnor

-1

我建议你不要自己写这个，而是寻求一个现成的解决方案。如果您只想为旧版浏览器提供支持，那么您可能需要解决自己的复杂问题。

例如，这里是我使用的垫片（和建议上http://html5please.com）：https://github.com/mathiasbynens/jquery-placeholder/blob/master/jquery.placeholder.js

来吧，阅读代码。这些都是你写这样的垫片时，需要心中有一个问题：

检测浏览器的支持，
跟踪时，框包含实际输入与否;
提交表单前添加一个类，允许占位符不同的文字颜色，
明确的占位符，
明确重新加载页面时，占位符，
手柄textarea，
手柄input[type=password]

而这可能不是全部。（我已链接库还挂钩到jQuery的，为了使.val()回报''时，有在框中没有真正的输入

也有一个使用完全不同的方法的另一个垫片：https://github.com/parndt/jquery-html5-placeholder-shim/blob/master/jquery.html5-placeholder-shim.js

这个库不会触及输入的实际值，而是直接在其上显示一个元素。

来源

2013-08-28 12:25:56 Kos

占位符不起作用

回答

相关问题