如何从ajax调用返回.wrap(）元素

How to .wrap() elements returned from an ajax call

本文关键字：wrap 元素 返回 调用 ajax      更新时间：2023-09-26

UPDATE：答案适用于FILTER not FIND。。。。我不知道为什么。

这让我很为难。我到处找了，但没有找到这个具体的问题，所以我发布了它。

我有一个应用程序，我在其中填写一些表格，然后通过jquery ajax提交到php文件，然后取回数据。当我取回数据时，我试图用另一个div包装每个.contentarea类，但我无法使其工作。

这是我的

$(document).delegate('.moduleform', 'submit', function(event) {
event.preventDefault();
formData = $(this).serialize();
$.ajax({
type: "POST",
dataType: "text",
url: "layouts/" + folder + "/make-layout.php",
data: formData
}).done(function(data) {
$(data).filter('.contentarea').each(function(){
var html = $(this).html();
$(html).wrap('<div class="contentarea_container" data-module="freeform"></div>');
});
$('#container').append(data);
$('#load').dialog('close');
$('#loadContent').empty();
});
});

当我控制台.log（$（this））；它看起来像控制台中的一个对象。当我控制台.log（$（this）.html（））；它看起来像HTML。但由于某种原因，我不知道如何将每个.contentarea与另一个div.包装在一起

我认为这与将数据转换为HTML或类似的内容有关。我可以针对数据变量中的项，但由于某种原因，我无法使包装工作。请帮忙！

.wrap直接在DOM上工作。因此，您先将data附加到#container，然后像这样调用.wrap：

$(document).delegate('.moduleform', 'submit', function(event) {
  event.preventDefault();
  formData = $(this).serialize();
  $.ajax({
    type: "POST",
    dataType: "text",
    url: "layouts/" + folder + "/make-layout.php",
    data: formData
  }).done(function(data) {
    var $data = $(data).appendTo('#container');
    $data.find('.contentarea').wrap('<div class="contentarea_container" data-module="freeform"></div>');
    $('#load').dialog('close');
    $('#loadContent').empty();
  });
});

演示：

var data = '<div><div class="contentarea">c</div></div><div><div class="contentarea">d</div></div>';
var $data = $(data).appendTo('#container');
$data.find('.contentarea').wrap('<div class="contentarea_container" data-module="freeform"></div>');
$('#out').text($('#container').html());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container">
  <div>
    <div class="contentarea">a</div>
  </div>
  <div>
    <div class="contentarea">b</div>
  </div>
</div>
<div id="out"></div>

相关文章：