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.stopPropagation()

event.preventDefault()

改为使用html（）（或尝试其他变体，例如insertAfter())
使用$('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
});

Answer 2

删除event.preventDefault();或将其移至追加附件下方。

jQuery在IE8上附加了奇怪的行为

2 个答案: