>웹 프론트엔드 >JS 튜토리얼 >jQuery+AJAX는 페이지의 배경을 호출합니다.

jQuery+AJAX는 페이지의 배경을 호출합니다.

php中世界最好的语言
php中世界最好的语言원래의
2018-04-04 15:37:591822검색

이번에는 jQuery+AJAX 호출 페이지 백엔드를 가져오겠습니다. jQuery+AJAX 호출 페이지 백엔드의 주의사항은 무엇인가요? 실제 사례를 살펴보겠습니다.

이 문서의 예제는 참고용으로 jQuery AJAX 호출 페이지 배경 방법을 공유합니다. 구체적인 내용은 다음과 같습니다

1.

2. 먼저 페이지의 배경 파일 decos.aspx.cs에

reference를 추가하세요.

System.Web.Services 사용;

1) 매개 변수 없이 메서드 호출.

이 버전은 .net Framework 2.0보다 낮을 수 없습니다.
백엔드 코드:

[WebMethod]   
public static string SayHello()   
{   
   return "Hello Ajax!";   
}
JS 코드:

$(function() {   
  $("#btnOK").click(function() {   
    $.ajax({   
      //要用post方式   
      type: "Post",   
      //方法所在页面和方法名   
      url: "Demo.aspx/SayHello",   
      contentType: "application/json; charset=utf-8",   
      dataType: "json",   
      success: function(data) {   
        //返回的数据用data.d获取内容   
        alert(data.d);   
      },   
      error: function(err) {   
        alert(err);   
      }   
    });   
  
    //禁用按钮的提交   
    return false;   
  });   
});
페이지 코드:

  <form id="form1" runat="server">
  <p>
    <asp:Button ID="btnOK" runat="server" Text="验证用户" />
  </p>
  </form>
실행 효과는 다음과 같습니다.

2) 매개변수 메서드 호출이 있습니다.

백엔드 코드:

[WebMethod]   
public static string GetStr(string str, string str2)   
{   
  return str + str2;   
}
JS 코드:

$(function() {   
  $("#btnOK").click(function() {   
    $.ajax({   
      type: "Post",   
      url: "demo.aspx/GetStr",   
      //方法传参的写法一定要对,str为形参的名字,str2为第二个形参的名字   
      data: "{'str':'我是','str2':'XXX'}",   
      contentType: "application/json; charset=utf-8",   
      dataType: "json",   
      success: function(data) {   
        //返回的数据用data.d获取内容   
         alert(data.d);   
      },   
      error: function(err) {   
        alert(err);   
      }   
    });   
  
    //禁用按钮的提交   
    return false;   
  });   
});
실행 효과 다음과 같습니다:

3). Return

arraymethod백엔드 코드:

[WebMethod]   
public static List<string> GetArray()   
{   
  List<string> li = new List<string>();   
  
  for (int i = 0; i < 10; i++)   
    li.Add(i + "");   
  
  return li;   
}

JS 코드:

$(function() {   
  $("#btnOK").click(function() {   
    $.ajax({   
      type: "Post",   
      url: "demo.aspx/GetArray",   
      contentType: "application/json; charset=utf-8",   
      dataType: "json",   
      success: function(data) {   
        //插入前先清空ul   
        $("#list").html("");   
  
        //递归获取数据   
        $(data.d).each(function() {   
          //插入结果到li里面   
          $("#list").append("<li>" + this + "</li>");   
        });   
  
        alert(data.d);   
      },   
      error: function(err) {   
        alert(err);   
      }   
    });   
  
    //禁用按钮的提交   
    return false;   
  });   
});
페이지 코드:

<form id="form1" runat="server">
<p>
  <asp:Button ID="btnOK" runat="server" Text="验证用户" />
</p>
<ul id="list">
</ul>
</form>
실행 결과 그래프:

나는 이 사례를 읽으셨다고 믿으세요. 방법을 익힌 후 PHP 중국어 웹사이트의 다른 관련 기사에 주목하여 더 흥미로운 내용을 확인하세요!

추천도서:

Ajax 새로고침 없이 도, 시, 군 3단계 연결

AJAX는 페이지를 표시한 후에만 로드됩니다

위 내용은 jQuery+AJAX는 페이지의 배경을 호출합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.