javascript - 如何在AJAX响应中用新内容替换<td>和<div>的内容？

Question

为了让您理解我的问题，我在这里仅放置了必要的代码。

HTML 代码:

<td style="text-align:center" id="brand_image_td_101">Some text goes here</td><!-- This is the td whose content need to be replaced with new content-->

<div id="brand_101"><!-- This is the div whose content need to be replaced with new content-->    
  <a href="#" id="promotion_status_101">
  <button type="button" class="btn btn-default brmodalbtn" data-toggle="modal" data-target="#BrandImageModal" id="101">On</button>
  </a>
</div>

单击上面的 div 按钮时会显示模式对话框，AJAX 请求转到 PHP 页面，从那里出现错误或成功消息等。

到这里为止一切正常。我面临的问题是替换上面 <div id="brand_101"> 的内容。我想替换上面<div id="brand_101">的内容包含以下内容:

<td style="text-align:center" id="brand_image_td_101"><img src="http://web_prj.com/pqr.php/uploads/a123.jpg" width="80" height="80"></td><!-- This is the new td content-->

<div id="brand_101"><!-- This is the new div content-->
  <a href="#" id="promotion_status_101" onClick="change_promotion_status('http://web_prj.com/pqr.php', 'promotion_status', '101', '0'); return false;">
  <button type="button" class="btn btn-default">Off</button>
  </a> 
</div>

这件事我想在 jQuery 函数的成功响应中实现。但我不明白我应该如何实现这一目标。

以下是我编写的 jQuery AJAX 函数:

$('#form').submit(function(e) {
  var form = $(this);
  var br_id = $('#brand_id').val();//This variable contains value 101
  var status = '0';
  var module_url = $('#module_url').val();//This variable contains value http://web_prj.com/pqr.php
  var upload_url = $('#upload_url').val();//This variable contains value http://web_prj.com/pqr.php/uploads/a123.jpg
  var formdata = false;
  if(window.FormData) {
    formdata = new FormData(form[0]);
  }

  var formAction = form.attr('action');

  $.ajax({
    type        : 'POST',
    url         : 'manufacturers.php',
    cache       : false,
    data        : formdata ? formdata : form.serialize(),
    contentType : false,
    processData : false,

    success: function(response) { 
      if(response.error == 0) {  
        $('#messages').addClass('alert alert-danger').text(response.error_message);

      } else { 
        $('#BrandImageModal').modal('hide');
        //location.reload();       
      }
    },
    dataType:"JSON"
  });
  e.preventDefault();
});

我应该如何用 AJAX 函数中的变量值创建的新内容替换 和 的内容，以便我可以获得上面的内容？

Answer 1

也许我误解了，但你可以尝试这样的事情:

//put the following into the the success function where you want to add new content
// create an string containing the html you want to insert
var newContent = '<a href="#" id="promotion_status_101" onClick="change_promotion_status('http://web_prj.com/pqr.php', 'promotion_status', '101', '0'); return   false;"><button type="button" class="btn btn-default">Off</button></a> ';

// remove old content from the div. Now you just have an empty div
$('#branding-101').html('');
// add the new content to the div
$('#branding-101').html(newContent);

或者您是否需要从响应中提取新值？如果是这种情况，您会做同样的事情，只是您会通过连接响应文本中的值来构建字符串..