jQuery .clone() 和 Microsoft Explorer(bug？)

Question

我在使用 Microsoft Explorer 6/7 和 jQuery“克隆”功能时遇到一些问题。我使用的 jQuery 是:

$(function() {
  $('#addFields').click(function() {
    var newCredit = $('#original').clone(); // create new set
    newCredit.find('input').val(''); // empty input fields
    $(this).before(newCredit); // append at the end
    return false;
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="original">
  <li id="prodEnt">
    <label class="description" for="entity[]">Entity </label>
    <div>
      <input name="entity[]" class="element text medium" type="text" value="" />
    </div>
  </li>

  <li id="entFunc">
    <label class="description" for="element_5">Function </label>
    <div>
      <input name="function[]" class="element text medium" type="text" value="" />
    </div>
  </li>

  <li class="section_break_small"></li>
</div>

Microsoft 浏览器无法复制多个克隆，并且不会对新元素设置样式 (CSS)。

请告诉我一个 IE 友好的替代方案!谢谢。

Answer 1

你不能/不应该<li>没有父元素的元素 <ul> 。此外，你不能/不应该 <div> <li> 内的元素就像你一样。最后，你有 id正在克隆的 HTML 中的属性，这将导致具有相同 id 的重复元素。如果更换外层original div 并将其设为 <ul> ，去掉 id 属性并将其设为 class相反，应该没问题。

话虽如此，it does work for me on IE7 .

编辑

回复您的评论:

要仅选择第一个，请执行以下操作(假设它的类为 fields ):

$('ul.fields').eq(0).clone();