ajax学习

最新推荐文章于 2022-11-30 19:39:58 发布

lzmings

最新推荐文章于 2022-11-30 19:39:58 发布

阅读量289

点赞数

分类专栏： C# 文章标签： asp.net ajax aja基础

本文链接：https://blog.csdn.net/lzmings/article/details/44732217

版权

C# 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

最近这几天一直在学习ajax，其实ajax就是那几个东西。

1.创建异步的请求javaScrict 类入下代码：

//根据浏览器不同创建相应的异步对象
function createXmlHttp() {
    request = false;
    try {
        request = new ActiveXObject("Msxml2.XMLHTTP");
        //alert("here");
    } catch (e) {
        try {
           
            request = new ActiveXObject("Microsoft.XMLHTTP");
           
        } catch (e2) {
            request = false;
        }
    } 
          if (!request && typeof XMLHttpRequest != 'undefined') {
              request = new XMLHttpRequest();
          }
    return request;
}

2.将数据发送到服务器，有两种请求方式。

（1）get方式，提交时不带任何参数，如下代码：

      function getData() {
             var xmlrequest = createXmlHttp();
             xmlrequest.open("GET", "FirstAjaxForm.aspx", true);
         xmlrequest.onreadystatechange = function () {    //当服务器的状态改变时
              if (xmlrequest.readyState == 4) {          //服务器已经完全数据的传送
                  if (xmlrequest.status == 200) {        //服务器发送回来的 数据是正常的
                      alert(xmlrequest.responsText);
                  }
              }
              //alert("now");
          }
             xmlrequest.send(null);                  //请求服务器

         }

（2）post方式，提交时要穿参数。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="LOGIN.aspx.cs" Inherits="WebApplication2.LOGIN" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="common/common.js"></script>
    <style type="text/css">
     .table
     {
     	border:0px;
     }
    </style>
    <script type="text/javascript">
        window.onload = function () {
            getElement("login").onclick = doLogIn;
            xhr = createXmlHttp();
        }

        //用户点击登陆按钮
        function doLogIn() {
            var name = getElement("txtName");
            var password = getElement("txtPassword");
            if (name.value == "") {
                alert("请输入用户名");
                name.focus();
            }
            else if (password.value == "") {
                alert("请输入密码");
                password.focus();
            }
            else {
                valideInput(name, password)
                
            }
        }

        //用户登陆
        function valideInput(txtName,txtpassword) {
            var name = txtName.value;
            var txtpassword = txtpassword.value;
            xhr.open("post", "LOGIN.aspx", true);
            xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4) {
                    if (xhr.status == 200) {
                        var res = xhr.responseText;
                        var json = eval('(' + res + ')');
                        switch (json.status) {
                            case "1":
                                alert("验证不通过");
                                break;
                            case "0":
                                alert("验证通过");
                                break;
                            default:
                                alert("发生未知错误");
                                break;
                        }
                    }
                }
            }
            xhr.send("isPostback=1&txtName=" + name + "&txtPassword=" + txtpassword);
        } 
    
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <table class="table" >
    <tr>
    <td>用户名</td>
     <td>
         <input id="txtName" type="text" /></td>
    </tr>

     <tr>
    <td>密码</td>
     <td>
         <input id="txtPassword" type="password" /></td>
    </tr>

     <tr>
    <td>
        <input id="login" type="button" value="登陆"  οnmοusedοwn="doLogIn()"/></td>
     <td>
         <input id="Button2" type="button" value="注册" /></td>
    </tr>
    </table>
    
    </div>
    </form>
</body>
</html>

lzmings

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ajax学习

最近这几天一直在学习ajax，其实ajax就是那几个东西。1.创建异步的请求javaScrict 类入下代码：//根据浏览器不同创建相应的异步对象function createXmlHttp() { request = false; try { request = new ActiveXObject("Msxml2.XMLHTTP"); /
复制链接

扫一扫

专栏目录