Question

我试图使用.load（）方法将元素追加到列表中以从另一个页面中检索元素。

但是当我使用这个方法时，它会删除当前的DOM元素并替换它们，而不是将它们附加到列表中。

非常感谢任何帮助。

以下代码：

var $container = $('#container');
$('#insert a').click(function () {
          var newEls;

          $container.load('../pages/2.html .element', function () {
              newEls = $(this);
          });
          $container.isotope('insert', $(newEls));

          return false;
      });

Answer 1

当然，你应该告诉同位素在装载后插入。

e.g。

      $container.load('../pages/2.html .element', function () {
          newEls = $(this);
          $container.isotope('insert', $(newEls));
      });

否则您在加载之前插入当前内容（或空div）。

你的$container.isotope('insert', $(newEls));在加载甚至开始之前正在执行（加载是异步的，因此如果它在回调/函数中，你只能信任某些东西来对付加载的数据）。

除此之外，您正在重新加载'#container'的全部内容，因此它只会删除以前的子项。您需要附加内容，例如通过加载到虚拟元素然后附加到您的容器。

可能是这样的（未经测试）：

var $container = $('#container');
$('#insert a').click(function () {
          var $newEls;
          $container.append('<div id="#loadme"></div>');
          var $loadme = $('#loadme');
          $('#loadme').load('../pages/2.html .element', function () {
              $newEls = $loadme.children();
              $loadme.children().unwrap();
              $container.isotope('insert', $newEls);
          });

          return false;
      });

通常情况下，我不会在这种情况下使用load，而是调用AJAX get并附加返回的元素。更简单。

同位素附加方法去除当前元素

1 个答案:

可能是这样的（未经测试）：