jquery ajax 简单范例(界面+后台)

  界面:

  

复制代码 代码如下:

  <script>

  $(document).ready(function () {

  $("#b01").click(function () {

  htmlobj = $.ajax({ url: "/Content/upFile/测试.txt", async: false });

  $("#div01").html(htmlobj.responseText);

  });

  });

  $(document).ready(function () {

  $("#test").load("/Content/upFile/测试2.txt #p1", function (responseTxt, statusTxt, xhr) {

  if (statusTxt == "success")

  alert("外部内容加载成功!" + xhr);

  if (statusTxt == "error")

  alert("Error: " + xhr.status + ": " + xhr.statusText);

  });

  });

  $(document).ready(function () {

  $("#getbutton").click(function () {

  $.get("/DownSet/index", function (data, status) {

  alert("数据:" + data + "\n状态:" + status);

  });

  });

  });

  $(document).ready(function () {

  $("#postbutton").click(function () {

  $.get("/CustomerInformation/getS", { par: "ww" }, function (data, status) {

  alert("数据:" + data + "\n状态:" + status);

  $("#postText").html(data);

  });

  });

  });

  </script>

  <div id="div04">

  <h2 id="postText">post方法加载文本后 会在这里显示</h2>

  <input type="button" value="post方法获取" id="postbutton" />

  </div>

  <div id="div03">

  <h2 id="getText">get方法加载文本后 会在这里显示</h2>

  <input type="button" value="get方法获取" id="getbutton" />

  </div>

  <div id="div02">

  <h2>jquery load方法加载的显示在这里</h2>

  <h2 id="test">加载文本后 会在这里显示</h2>

  </div>

  <div id="div01">

  <h2>加载文本后 会在这里显示</h2>

  </div>

  <p>

  <input type="button" value="加载文本" id="b01"/>

  </p>

  后台:

  

复制代码 代码如下:

  public string getS(string par)

  {

  string content = "";

  if (par.Equals("ww"))

  {

  content = "cheng gong le";

  }

  else

  {

  content = "shi bai le";

  }

  return content;

  }