동적으로 추가 된 JavaScript가 IE에서 동적으로 추가 된 필드를 찾지 못함

Question

"행 추가"버튼이있는 테이블이 있습니다. 이 버튼은 JQuery를 사용하여 동적으로 행을 추가합니다. 첫 번째를 복사 한 다음 모든 id = ".."를 증가 된 숫자로 바꿈으로써 작동합니다.

문제는 행처럼 보이는 YUI 자동 완성 기능을 가지고있다 다음

<td> 
    <input type="hidden" name="location_num[0]" value="508318" maxLength="25" style="width:230px" id="location_num[0]"/> 
    <input type="textbox" name="location_numDisplayDesc[0]" value="WINNIPEG" maxLength="25" style="width:230px" id="location_numDisplayDesc[0]"/> 
    <div id="Container_location_num[0]" style="display:inline;"></div> 

    <script type="text/javascript"> 

     // Initialize autocomplete 
     var location_numAC = new YAHOO.widget.AutoComplete(
      "location_numDisplayDesc[0]", 
      "Container_location_num[0]", 
      locationDataSource, 
      acConfig); 

     location_numAC.useShadow = true 
     location_numAC.useIFrame = true 
     location_numAC.dataErrorEvent.subscribe(acErrorFunction); 

     // Format results to include the reference number 
     location_numAC.formatResult = function(resultItem, query) { 
      return resultItem[0]; 
     }; 

     // Clear key before request 
     location_numAC.dataRequestEvent.subscribe(function fnCallback(e, args) { 
     YAHOO.util.Dom.get("location_num[0]").value = ""; }); 

     // Set key on item select 
     location_numAC.itemSelectEvent.subscribe(function(event, args) { 
      YAHOO.util.Dom.get("location_num[0]").value = args[2][1]; 
     }); 

     // Clear key when description is cleared 
     location_numAC.textboxBlurEvent.subscribe(function fnCallback(e, args) { 
      if (isEmpty(YAHOO.util.Dom.get("location_numDisplayDesc[0]").value)) { 
       YAHOO.util.Dom.get("location_num[0]").value = ""; 
      } // end if 
     }); 
    </script> 
</td> 

이 코드는 파이어 폭스에서 잘 작동하고 새로 만든 자동 완성이 작동하지만 IE에서 (6 & 7) 나는 location_num_AC가 성공적으로 작성되지 않는다는 오류가 발생합니다. 나는 새로 생성 된 입력이나 div를 읽지 못하기 때문이라고 생각합니다. 나는 자바 스크립트를 포장하려고했습니다.

$("Container_location_num[0]").ready(function {...}); 

그러나 작동하지 않는 것 같습니다. 누구든지 다른 아이디어가 있습니까?

Answer 1

IE에서 DOM에 삽입되는 양식 필드는 예상대로 양식 컬렉션에 추가되지 않습니다.

일반적으로 두 가지 방법의 양식 필드 하나를 참조 할 수는 양식 필드 이름이나 인덱스함으로써,

document.forms[0]["myFormName"]; 
document.forms[0][12]; 

합니다. 그러나 IE의 양식 필드에 을 입력 할 수없는 경우은 색인으로 만 참조하십시오. 코드 (또는 지원 코드)가 이름의 컬렉션에서 양식 필드를 찾고 있다면 분명히 문제가있는 것입니다.

유일한 키가 이름이면 모든 양식 필드를 색인으로 반복하여 찾고있는 것을 찾을 수 있지만 분명 선형 작업이 될 것입니다. 루프를 통해 숫자로 인덱싱되지만 이름으로 인덱싱되지 않는 양식 필드를 찾고 양식 개체를 직접 업데이트 할 수 있습니다.

프로젝트에서 어떻게 발생했는지 알 수있는 세부 정보가 충분하지 않지만 필드를 동적으로 추가하기 때문에 역할을 수행하는 것처럼 들리는 IE의 단점 중 하나입니다.