Question

我最近coded a form内有JQuery Validation。因为我在输入字段中使用placeholder方法并且IE不支持这些方法，所以我使用patch来正确显示IE中的占位符。

这一切都有效，但是当您在IE中打开de网站时，您会看到我打开页面时立即激活JQuery验证，这显然不是重点。所以我认为这是某种错误。我查看了.js文件，但我的JS技能不太好，所以我想知道这个bug是什么...
有想法的人？

Answer 1

<input type="text" placeholder="abc"/>

jQuery的：

$( function() {
  $('[placeholder]').on({

  focus: function() {
    if( $(this).val() == $(this).attr('placeholder') ) {
       $(this).val(''); 
    } 
  },

  blur: function(){
      if( !$(this).val() ) {
          $(this).val( $(this).attr('placeholder') );
       }

   } 

 } ).each( function() {
        $(this).val( $(this).attr('placeholder') ) ;
  } );
});

运行它：

<html>
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">         </script>
    <script type="text/javascript"> 
      //script from above;
    </script>
    </head>
    <body>
      <input type="text" placeholder="abc"/>
    </body>
    </html>

Answer 2

我如何处理IE？：

使用条件注释加载ie.js和ie.css
在这些文件中，你可以负责修复开发过程中可能出现的一些问题。

我的建议是，如果您使用的是jQuery，则可以创建一个jquery插件placeHolder();并在所有inputs上使用类名placeholder调用它：

jQuery.fn.placeHolder=function(){
    return this.each(function(){
        var a=$(this).attr("value");

        $(this).focus(function(){
            if($(this).attr("value")==a){
                $(this).attr("value","");
            }}
        );

        $(this).blur(function(){
            if($(this).attr("value")==""){
                $(this).attr("value",a);
            }
        });

    });
};

$('input.placeholder').placeHolder();

take a look on jsfiddle

针对IE占位符的Javascript修复中的错误

2 个答案: