用另一页的结果替换div

Question

我有一个div，其中包含一些数据：

<div id='happyDiv'>
 <a href='#' id='a' class='clickMe'>A</a>
 <a href='#' id='b' class='clickMe'>B</a>
 <a href='#' id='c' class='clickMe'>C</a>
 </div>

当用户单击任何一个链接时，我需要调用另一个页面，并用页面调用的结果替换$（'＃happyDiv'）。 所以我用ajax

 $('.clickMe').click(function()
 {
       var userData = $(this).attr('id');
       $.ajax({
                   type: "POST",
                   url: "someDir/somePage.php",
                    data:"id="+userData,
                   success: function(result)
                   {
                            $('#happyDiv').replaceWith(result);
                   }
              });
 });

我希望#happyDiv具有来自Ajax调用的结果数据。 它确实有，但它也包含调用之前的内容。 3个ahref链接。 我怎样才能“ replaceWith”，以便链接发生在ajax响应上，而我只留下结果呢？

链接是静态的，并且在第一页加载时存在。

所以我最终得到的是

<div id='happyDiv'>
    ///REsults from AJAX call
    <a href='#' id='a' class='clickMe'>A</a>
    <a href='#' id='b' class='clickMe'>B</a>
    <a href='#' id='c' class='clickMe'>C</a>
</div>

Answer 1

使用html() ...，最好将数据作为对象而不是查询字符串发送。.清晰易读。

  $.ajax({
               type: "POST",
               url: "someDir/somePage.php",
                data:{id:userData},
               success: function(result)
               {
                      $('#happyDiv').html(result);
               }
          });

Answer 2

1. 检查您的DOM，它只有一个#happyDiv吗？
2. 检查结果变量，也许它包含这三个链接。

$（..）。replaceWith替换HTML元素，因此它可能与您所说的不完全相同。

Answer 3

您可以尝试使用纯JavaScript代码而不是jquery代码来替换div的内容，请检查以下代码：

$.ajax({
    type: "POST",
    url: "someDir/somePage.php",
    data:{id:userData},
    success: function(result)
    {
      document.getElementById("happyDiv").innerHTML=result;
    }
});

还要检查您对ajax请求有什么响应？