jQuery가 IE8에서 이상한 동작을 추가합니다.

Question

IE8 버튼을 클릭하여 div에 요소를 추가하려고 할 때 두 번째 누를 때까지 추가하지 마십시오. 그런 다음 두 개의 새로운 요소를 추가합니다. 여기 코드는 다음과 같습니다

$(options.addButton).click(function(event) { 
    var prototype = $(options.prototypeContainer).attr('data-prototype'); 
    event.preventDefault(); 
    var fileField = $(prototype.replace(/__name__/g, fieldCount)); 
    fieldCount++; 
    $(options.uploadingImagesWrapper).append(fileField); 
    //fileField.slideDown(); 
    return false; 
}); 

컨테이너의 마크 업이 같이 간다 :

<div id="uploading-component-images"> 
    <!-- here I inserts new elements --> 
</div> 

<!-- the button the triggers insertion function --> 
<a class="btn" href="#" id="add-another-image">{{'label.component.add_image_field'|trans }}</a> 

그리고 하나의 요소 태그는 다음과 같습니다 : 여기

<div class="image-file-field"> 
    <input type="file" name="{{ full_name }}[file]" id="{{ id }}" /> 
    <button type="button" class="offset0_5 remove-image btn btn-mini"> 
     <span class="icon-remove"></span> 
    </button> 
</div> 

이 스크린 샷입니다 - 어쩌면 그것으로 이해하기가 더 쉬울 것입니다. http://joxi.ru/RFBeUtg5CbBaNyCgm14 jquery의 버전은 1.9.1입니다.

Answer 1

event.preventDefault();을 제거하거나 append sentence 아래로 옮깁니다.

Answer 2

비슷한 문제가있었습니다. (특별한 순서없이) 다음과 같이하십시오 :

1. event.stopPropagation()에 넣어 사용하는 HTML (

2. event.preventDefault() 후)을 대신 (또는 다른 변화를 시도 insertAfter())

3. 사용 $('body').append(...)처럼 다음 사용 element.offset 올바른 높이와 왼쪽으로 위치를 설정합니다.이 마지막 하나는 나를 위해 일했습니다. 그것은 고통이지만 IE8도 그렇습니다.

가 여기에 내가 이벤트 객체 오프셋을 얻을 사용하고 내 코드 (, 당신은 사용하여 동일한 동작을 얻을 수 있습니다 jQuery의 offset()):

var overflow = $('#overflowContainer'); 
var windowScrollTop = $(window).scrollTop(); // if window scrolled then need to minus this from the height so that menu stays in correct place 
var target = $($event.currentTarget); 
var offset = target.offset(); 
var dd_top = ((offset.top + target.outerHeight()) - windowScrollTop); 
$('body').append(overflow); // must append it to the body for IE to work       
var left = target.offset().left; 
overflow.css({        
    "top": dd_top + "px", 
    "position": "fixed", 
    "left": left // right-aligned with right border of overflow container 
});