IE에서 HTML 입력 필드 자리 표시 자

Question

IE에서 표시 할 자리 표시자를 만들기 위해 jquery (From this source) 솔루션을 사용했지만 내 페이지의 숨겨진 필드에서 작동하지 않습니다.

여기에서 DEMO을 보면 사람 추가 버튼을 클릭하여 주소 및 세부 정보를 입력하고 사람 추가를 클릭하여 텍스트 필드를 만들 수 있습니다.

그리고 새로 생성 된 필드에 자리 표시자가 표시되지 않는 문제가 있습니다. 또한 zip의 유효성 확인 메시지가 기본적으로 표시됩니다.

$(function() { 
    var input = document.createElement("input"); 
    if(('placeholder' in input)==false) { 
     $('[placeholder]').focus(function() { 
      var i = $(this); 
      if(i.val() == i.attr('placeholder')) { 
       i.val('').removeClass('placeholder'); 
       if(i.hasClass('password')) { 
        i.removeClass('password'); 
        this.type='password'; 
       }   
      } 
     }).blur(function() { 
      var i = $(this);  
      if(i.val() == '' || i.val() == i.attr('placeholder')) { 
       if(this.type=='password') { 
        i.addClass('password'); 
        this.type='text'; 
       } 
       i.addClass('placeholder').val(i.attr('placeholder')); 
      } 
     }).blur().parents('form').submit(function() { 
      $(this).find('[placeholder]').each(function() { 
       var i = $(this); 
       if(i.val() == i.attr('placeholder')) 
        i.val(''); 
      }) 
     }); 
    } 

Answer 1

작업 fiddle의 메시지에 대해

.test{ 
display:inline-block; 
background:red} 

를 참조하십시오 자리 표시 자 plugin.

Answer 2

jQuery 코드는 코드가 실행될 때 존재하는 요소에 대해서만 이벤트를 구성합니다. 이후에 만들어진 요소에는 해당 이벤트가 연결되지 않습니다. 이벤트가 설정된 뒤 생성되는 새로운 요소로 작동하는 동적 이벤트를하기 위해

, 당신은 $().focus() 또는 $().blur() 방법보다는 jQuery를 $.on() 방법을 사용해야합니다.

당신과 같이 기존의 이벤트 핸들러를 교체해야합니다 :

$('[placeholder]').on("focus", function(){ .... }); 

이이 자리 이벤트가 동적으로 생성 된 요소에 반응 할 것입니다.

다른 방법으로 사용할 수있는 자리 표시 자 polyfill 스크립트 중 하나를 시도해 볼 수도 있습니다. 몇 개의 링크는 See here입니다. 새로운 필드

를 생성 한 후 자리 표시 기능을 호출 할 필요

$('.test').on('click', function() { 
     if(!$("#signupForm").valid()){ 
      return; 
     }    
     if (c<5){ 
      $('#loops').append(HTMLloop(++c)); 
      setPlaceholder() 
     }    
    }); 

이가 콜입니다 :

Answer 3

는 코드의 우편