Question

我是ajax的新手。

我有 index.html

<script>
$(document).ready(function(){
  $("button").click(function(){
    $.ajax({url:"n.php",success:function(result){
      $("#div1").html(result);
    }});
  });
});
</script>

<div id="div1" style="margin-left: 25;"></div>
<button>Add Author</button>

n.php

Name:<input type="text" name="txtname">
age:<input type="text" name="txtage">

我只想在“添加作者”按钮点击时在index.html页面上添加名称和年龄文本框而不刷新页面。但是上面的代码只加载一次名称和年龄文本框。每次按钮点击时我都想要它。

修改

现在，如果我想要另外一个按钮'删除作者'，并希望执行完全相反的操作（即）删除两个文本框。我该怎么办？你可以帮忙吗？

并想知道如何检查验证服务器端？

请帮助。

Answer 1

更改此

$("#div1").html(result);

到

$("#div1").append(result);

所以每次点击按钮，它都会附加文本框。

Answer 2

尝试以下方法：

<script>
$(document).ready(function(){
  $("button").click(function(){
    $.ajax({url:"n.php",success:function(result){
      $("#div1").append(result);
    }});
  });
});
</script>

使用append代替html。 append会在div中出现的任何内容的末尾添加响应，其中html将替换当前内容。

Answer 3

 <script>
   $(document).ready(function(){
   $("button").click(function(){
    $.ajax({url:"n.php",success:function(result){
  $("#div1").append(result);
   }});
   });
  });
  </script>

    <div id="div1" style="margin-left: 25;"></div>
    <button>Add Author</button>

使用ajax加载内容

3 个答案: