jquery删除筛选响应中的特定div

时间:2015-11-18 16:14:17

标签: javascript jquery html ajax jquery-filter

我正在进行GET ajax调用,并将html作为数据返回。

我只想返回div#product-detail-response中的内容,并将该html替换为div.product-detail-info中的内容。

这很好用,但是当我以管理员身份登录CMS时,它会在每个页面的末尾吐出调试代码。我知道我可以禁用该功能,但我希望将其保留,只需从响应中删除调试div。

* div#debugging-info存在于div#product-detail-response

// this displays the html correctly, but it includes the debugging-info that I want removed
var $response=$(data);
$(".product-detail-info").html($response.filter('#product-detail-response').html());

// I tried adding a remove in different spots of this line without success
$(".product-detail-info").html($response.filter('#product-detail-response').html()).remove("#debugging-info");

*我也放了一个显示器:无; .product-detail-info#debugging-info {}和this:

$("#debugging-info").hide();

在上面的代码之后。

响应:

<div class="product-detail-info">
   html and all the stuff I want to show up
   <div id="debugging-info">
      this shows debugging info, and I want to remove this div completely
   </div>
</div>

我想要的回应:

<div class="product-detail-info">
   html and all the stuff I want to show up
</div>

AJAX调用

$.ajax({
    url: '/product_detail_ajax/'+entry_id,
    type: 'GET',
    data : {},
    dataType: 'html',
    context: this,
    success: function (data) {
        var $response=$(data);
        $(".product-detail-info").html($response.filter('#product-detail-response').html());
        $(".breadcrumb-product-title").text($response.filter('#breadcrumb-product-title').text());
    },
    error: function (data) {
        // console.log('error');
    }
});

2 个答案:

答案 0 :(得分:2)

你实际上是这样的:

从您的通话中返回的数据

  var data = "<div class='product-detail-info'>html and all the stuff I want to show up<div id='debugging-info'>this shows debugging info, and I want to remove this div completely</div></div>";

现在创建一个dom obj来操纵你的数据

  var parsed = $('<div/>').html(data);

  parsed.find("#debugging-info").remove();

  $("#result").append(parsed.html());

FIDDLE

答案 1 :(得分:0)

html中注入响应dom之后,您可以隐藏调试信息元素,如下所示:

$response = $( data );
$( ".product-detail-info" ).html( $response.html() ).find( "#debugging-info" ).hide();

这是JS Fiddle