Javascript jquery克隆和之后

我一直有一个问题，调整一些图像是隐藏的封闭引导模式。这些图像层叠在一起，因此它们必须绝对定位。我想更正图像容器的大小，这样当打开模式时，它们看起来就不会奇怪了

我有一个快速调整大小的功能，但它只会工作，一旦图像是可见的。当用户调整浏览器窗口的大小时使用。使用它意味着用户可以在一小段时间内看到未调整大小的容器

下面的函数应该只在页面加载时和所有图像加载完毕后运行一次。问题在于，出于某种原因，原始模态与克隆模态一起被删除。如果我从jQuery链中删除.remove，那么克隆仍然存在，但原始的仍然会被删除

var cloneCounter = 0;

// Slow resize using jquery becuase
// the images are hidden.
function slowResize( parent, pId ) {
  // height of the largest image
  var largest = 0;

  var newId = "clone-" + cloneCounter + "-";

  // |find the modal that the parent is cloeset to
  // |-clone the modal
  // |--change the id of the clone
  // |--find all elements
  // |---change all the child ids
  // |--insert the clone into the dom
  // |--show the modal
  // |--hide it from view, make dimensions ( position: absolute, display: block, visibility: hidden )
  // |--find all the images related to the parent passed in
  // |---calculate which is the tallest
  // |--hide the clone
  // |--remove the clone

  var original = parent.closest( "div.modal" );
  var clone    = original.clone( true );

  clone
    .attr("id", newId + clone.attr( "id" ) )
    .find("*")
      .each( function( index, element ) {
        if ( element.id !== "" )
          element.id = newId + element.id;
      })
    .end()

    .after( original )
    .modal("show")
    .css({
      "visibility": "hidden",
    })
    .find( "#" + newId + pId ).find( "img" )
      .each( function() {
        largest = ( largest > $( this ).outerHeight() ) ? largest : $( this ).outerHeight();
       })
    .end()

    .modal("hide")
    .remove();

  // apply the style
  parent.css( "height", ( largest + 2 ) );

  ++cloneCounter;
}

---

另外，调整大小也不起作用，但我现在不太担心这个问题。

删除原始文件时遇到问题的原因是我使用了错误的jQuery方法。after获取要插入括号内的内容。我应该用的。insertAfter

$target.aftercontentToBeInserted

$contentToBeInserted.insertAftertarget

因为我是在克隆上调用该方法，所以我应该使用第二个示例

这是函数的固定版本

var cloneCounter = 0;

// Slow resize using jquery becuase
// the images are hidden.
function slowResize( parent, pId ) {
  // height of the largest image
  var largest = 0;

  var newId = "clone-" + cloneCounter + "-";

  // |find the modal that the parent is cloeset to
  // |-clone the modal
  // |--change the id of the clone
  // |--find all elements
  // |---change all the child ids
  // |--insert the clone into the dom
  // |--hide it from view, make dimensions available ( position: absolute, display: block )
  // |--find all the images related to the parent passed in
  // |---calculate which is the tallest
  // |--remove the clone

  var original = parent.closest( "div.modal" );
  var clone    = original.clone( true );

  clone
    .attr("id", newId + clone.attr( "id" ) )
    .find("*")
      .each( function( index, element ) {
        if ( element.id !== "" )
          element.id = newId + element.id;
      })
    .end()

    .insertAfter( original )
    .css({
      "display": "block",
      "left": "-9999px",
    })
    .find( "#" + newId + pId ).find( "img" )
      .each( function() {
        var c = this;

        if ( c.offsetParent !== null )
          largest = ( largest > c.height ) ? largest : c.height;
      })
    .end()

  clone.remove();

  // apply the style
  parent.css( "height", ( largest + 2 ) );

  ++cloneCounter;
}