Ajax教程：post和get请求

Question

我需要一份简单的ajax教程或案例，用于一个简单的输入表单，在这个表单中我想通过一个用户名发送到数据库，并回复结果。
欢迎任何推荐这样的教程，因为我只找到了一个使用Mootool的教程，但我正在寻找一个使用jQuery的教程！

- Reham Fahmy

---

http://blog.teamtreehouse.com/beginners-guide-to-ajax-development-with-php - rassa45

Answer 1

您可以尝试这样做：

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

该代码将把test.html文件的内容追加到#results元素中。

您可以在jQuery网站上找到更多信息。

更新：

使用此代码发送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 );
});

- apis17

Answer 2

假设您有一些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);
  }
});

- user626963

---

您可能需要设置参数名称，例如data: "username=" + myusername。 - GrandMasterFlush

你可以使用这个库 https://github.com/Guseyn/EHTML，在某些情况下仅使用HTML来执行AJAX。 - Guseyn Ismayylov

你可以将上面的代码用于提交，也可以添加数据类型，例如json。比如：dataType: 'json'。 - T.A.Chathura Priyahsad

请注意，您必须以json、对象或数组的形式传递数据参数，就像这个例子中所示：https://codetopology.com/scripts/jquery/jquery-ajax-method-with-example/#Example_2_-_Ajax_POST_Request - Ankit21ks