javascript - 替换后如何显示原来的元素？

Question

我有一个名为“frined-replace”的 div 和一个自动建议字段。当页面加载显示的 frined-replace div 内的内容时。当我们在输入字段中写入一些内容进行搜索时，frined-replace 就会被自动建议的数据替换。现在的问题是，当我写一些东西时，frined-replace div 会被数据替换，当我删除输入的输入字段字符时，我无法重新显示 frined-replace div 元素。

油炸替换:

   <li style="float:left; width:240; margin:2px 0 4px 2px; border-bottom:1px solid #CCC; background-color:#f90; height:30px;">

        <a href="<?php echo $config->baseUrlTs;?>messages?user_id=<?php echo $myusrid;?>" > 
        <img src="<?php echo $config->baseUrl;?><?php echo $imgs;?>" alt="" width="26" height="26"  />
        <font style="font-weight:bold; color:white"><?php //global $config;
            echo $myusrname;
        ?></font></a>

        </li>

这是 self 暗示部分:

$("#search").keyup(function(e){
var qr = $("#search").val();
         if(qr=="")
        {
            $("#erase").empty();
            return;
        }
$.ajax({
  url: "<?php echo $config->baseUrl;?>/themes/gr-mist/ajax/inbox-ajax.php?str="+$(this).val()+"&user_id="+<?php echo $userid;?>,
  context: document.body,
  success: function(data){

        $("#frined-replace").replaceWith(data);

        //$("#search").val('');
         //$('#search').val('').empty();

      }
   });
 });

Answer 1

我刚刚制作了一个片段代码，显示了可能的答案

    $("#search").keyup(function(e){
        var qr = $("#search").val();
        if(qr=="") {
            $("#frined-replace").html($("#frined-replace-bck").html());
            $("#frined-replace-bck").remove();
            $("#erase").empty();
            return;
        }

        if (!$('#frined-replace-bck').length) {
           var backup = $("#frined-replace").clone();
           backup.prop('id', 'frined-replace-bck');
           backup.css('display', 'none')
           $("#frined-replace").before(backup);
        }

        //Replace with your ajax call
        $("#frined-replace").html('<li>' + qr + '</li>');

        //$("#search").val('');
        //$('#search').val('').empty();
});

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <div>
      <input id="search" type="text"/>
      <div id="frined-replace">My initial content</div>
    </div>