用于发布和获取的Ajax教程

时间:2012-02-24 19:07:20

标签: jquery ajax

我需要一个简单的ajax教程或案例研究,用于简单的输入表单,我想通过输入表单发布用户名,输入表单将其发送到数据库并回复结果。
欢迎任何推荐这样的教程,因为我只有一个使用Mootool但我正在使用jQuery搜索一个!

2 个答案:

答案 0 :(得分:140)

你可以试试这个:

$.ajax({
  url: "test.html",
  cache: false,
  success: function(html){
    $("#results").append(html);
  }
});

此代码会将test.html文件的内容附加到#results元素

您可以在jQuery website找到更多信息。

<强>更新

使用此代码发送POST数据和输出结果。

var menuId = $("ul.nav").first().attr("id");
var request = $.ajax({
  url: "script.php",
  type: "POST",
  data: {id : menuId},
  dataType: "html"
});

request.done(function(msg) {
  $("#log").html( msg );
});

request.fail(function(jqXHR, textStatus) {
  alert( "Request failed: " + textStatus );
});

答案 1 :(得分:32)

假设您有一些类似的HTML:

<input type="text" name="username" id="username">
<div id="resultarea"></div>

您可以使用<script>之类的:

var myusername = $("#username").val();
$.ajax({
  type: "GET",
  url: "serverscript.xxx",
  data: myusername,
  cache: false,
  success: function(data){
     $("#resultarea").text(data);
  }
});