Question

我试图刷新div，但它重复其他所有内容。在我做任何事情之前，页面如下所示：initial page 第二个按钮应该刷新div，但是当我这样做时，这就是我得到的：after trying to refresh, it refreshes it, but duplicates everything else 我怎么做它只刷新div？

<!DOCTYPE html>
<html>
<head>

</head>
<body>
    <br/>
    <div id='ff'>something</div>
    <input id='input'/>
    <button id='btn1'>first</button>
    <button id='btn2'>second</button>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
           $('#btn1').click(function(){
               var input=$('#input').val();
               $('#ff').text(input);
           });
           $('#btn2').click(function(){
              $('#ff').load('thing2.html'); 
           });
        });
    </script>
</body>

Answer 1

在这一行

$('#ff').load('thing2.html');

您只是使用id =“ff”更新div，但是您要加载到thing2.html的整个内容中。

Answer 2

这是你在找什么？如果没有，你能解释一下吗？

$(document).ready(function(){
   $('#btn1').click(function(){
       var input=$('#input').val();
       $('#ff').text(input);
   });
   $('#btn2').click(function(){
      $('#input').val('');
   });
});

<div id='ff'>something</div>
    <input id='input'/>
    <button id='btn1'>first</button>
    <button id='btn2'>second</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

Answer 3

您正在再次加载things2.html，因此它会重复。我已经使用location.reload（）来刷新它的工作正常。这是你在找??

 $(document).ready(function(){
       $('#btn1').click(function(){
           var input=$('#input').val();
           $('#ff').text(input);
       });
       $('#btn2').click(function(){
         // $('#ff').load('things.html'); 
         location.reload();
       });
    });

如何在不添加的情况下刷新div

3 个答案: