샘플 코드는 귀찮아서 생략하고, 현상과 해결방안만 기술해보는데, 아래 나오는 내용은 그냥 개념적으로 적는 내용이다 보니….알아서 걸러들어야 함…;;;
ie9, chrome, firefox, opera 등에서는 dynamic dom object를 생성해서 jquery(‘#xxx’).append(dynamicObj); 형태로 추가하고, $(‘#dynamicObj’).bind(function() {xxx}) 형태로 이벤트를 걸어주면 작동하는데 전혀 문제가 없는데, IE8을 포함한 이전 버전에서는 위의 형태로 작업하는 경우 이벤트가 걸리지 않는 현상이 발생했었다.
해결책을 위해 dynamicObj에 들어갈 내용을 text형태로 변수에 담아서 append한 경우에는 정상적으로 작동하는……희한한 현상…
dynamicObj안에 들어갈 내용이 짧다면 상관없겠지만, 복잡하고 긴 내용이라면 대부분은 화면의 특정 영역에 복사될 내용을 숨겨두고 var dynamicObj = $(‘#tempObj’).clone(); 형태로 해당 내용을 복사해서 사용하는데, clone()으로 복사한 dynamicObj를 typeof로 확인해보면 일반 string형태가 아니라, Object형태로 반환되며, 이 object 형태로 반환된걸 $(‘#ddd’).append(dynamicObj); 로 추가하고, $(‘#dynamicObj’).attr() 이나, $(‘#dynamicObj’).bind()를 이용했을때, 멍청한 구버전의 IE에서 오작동을 한다.
이를 피하기 위해서 var dynamicObj = $(‘#tempObj’).clone().html(); 형태로 복사를 하게되면 object가 아니라 string 형태로 받을 수 있으며, 이를 append()하고 나서 이벤트를 걸어주면 정상 작동할 것이라 생각된다.;;;;;;
(아직 이렇게 실행은 안해봤고, 예전에 경험을 바탕으로 object가 아닌 string으로 append()하면 정상작동 했기에, 위의 방법도 정상작동하리라 추정하는 무책임한…….)
