• 03-22 Ajax验证用户登录


    在网页中一般是通过表单提交数据,而表单获取信息,抛弃当前页面重新加载一个新页面。

    现在,在webform网页中可以通过JueryAjax提交、处理数据的方式,达到异步刷新页面。

    表单提交数据和JueryAjax提交数据的区别:

    表单 表单获取信息,抛弃当前页面重新加载一个新页面。(只把数据提交出去)
    JueryAjax 提交数据,发送出去,再获取数据,更新信息,不刷新页面。(提交出去并反馈回来)

    以验证用户名是否重复为例:

    在Html中写函数:

     1 document.ready{}:整个页面加载完了触发函数内容
     2 $document.ready(
     3 {
     4 function ()//获取一下文本框的值
     5 {
     6 $("#TextBox1").blur(function())//blur当鼠标点击或离开的时候触发
     7 {
     8 var txt=$(this).val();//this代表当前的元素,在哪个元素的事件中写,就代表哪个元素
     9 }
    10 var txt = $("#TextBox1")//CSS选择器获取元素
    11 var txt=$("#TextBox1").val();//html获取元素的值在val中;在cs中获取元素的值是在value中
    12 //通过超链接把数据提交出去,反馈回来
    13 //如何使用Ajax把文本框的值发送出去
    14 $.ajax({
    15 url:"CheckuserName.aspx";//超链接传的参数
    16 type:"";//以什么样的方式传送数据
    17 data:{id:txt},//把用户名传送出去
    18 datatype:"xml";//反馈回的数据类型
    19 success function(data)//这里的data是返回的xml的信息,不同于上面的data,这里的data可以更改名称
    20 {
    21 var co=$(data).find("count").text();//怎么样获取返回的变量
    22 alert(co);//alert执行输出,获取数值(经常用)
    23 if(parseInt(c)==0)
    24 {
    25 $("Label1").html();
    26 var lb1=document.getElementById("Label1");
    27 lb1.innerHtml="";
    28 }
    29 else
    30 {
    31 $("Label1").html("已有此用户");
    32 }
    33 }
    34 })
    35 
    36 
    37 }
    38 })

    在Dafualt2.aspx的Page_Load中:

    在page_load中:

    private DataClassesDataContext _Context;
    protected void Page_Load(object sender, EventArgs e)
    {

    连接数据库
    _Context = new DataClassesDataContext();

    string uid= request["id"].tostring ();//验证一下id
    int count=_Context.Login.Where(r=>r.username==uid).count();//从数据库中查询
    response.write("<?xml.version='1.0'?>");//返回数据,往页面输出
    response.write("<count>"+count+"</count>");//xml可以自己做出标签,html是现有的标签
    response.close();
    XML也是一种标记语言,标记内容的作用
    以<?xml.version='1.0'?>的格式,代表这是XML的文件,解析的时候就默认是Xml的文档

    }

  • 相关阅读:
    C语言之回调函数&模块化
    680. 验证回文字符串 Ⅱ
    C++指针数组和数组指针
    345. 反转字符串中的元音字母
    633.平方数之和
    IDM使用介绍篇
    路由器无线桥接WDS
    约数的个数
    密码翻译
    查找学生信息
  • 原文地址:https://www.cnblogs.com/xiaoqingshe/p/4356919.html
Copyright © 2020-2023  润新知