zoukankan      html  css  js  c++  java
  • 在Ajax中使用JSON传递数据 [ZT]

    JSON是JavaScript对象与服务器对象交互的一种技术手段,JavaScript
    中使用function构建函数类,在.net服务器方使用JSON类库解析
    此JavaScript函数类达到JavaScript与服务器传递数据的目的.
    常被用于Ajax中.

    请求页send_json_request.aspx:
    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="send_json_request.aspx.cs" Inherits="Ajax_send_json_request" %>
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
    <script language="javascript" src="json.js"></script>
    <script language="javascript">
        var xmlHttp;
       
        function createXMLHttp()
        {
            if (window.ActiveXObject)
            {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            else if (window.XMLHttpRequest)
            {
                xmlHttp = new XMLHttpRequest();
            }
        }
       
        function user(name,pwd)
        {
            this.Name = name;
            this.Pwd = pwd;
        }
       
     function getUser()
     {
      return new user(document.getElementById('txtName').value,document.getElementById('txtPwd').value);
     }
     
        function getUserInfo()
        {
            var user1 = getUser();
            var json_user1 = JSON.stringify(user1);
      createXMLHttp();
            xmlHttp.onreadystatechange = handleStateChange;
            xmlHttp.open("POST","send_json_response.aspx?timeStamp="+new Date().getTime(),true);
            xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
            xmlHttp.send(json_user1);
      return false;
        }
       
        function handleStateChange()
        {

            if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
            {
                alert(xmlHttp.responseText);
            }
        }
       
    </script>
    </head>
    <body>
    <form id="Form1" runat="server">
        <div>
          用户名:
          <input type="text" name="txtName" id="txtName">
          密码:
          <input type="text" name="txtPwd" id="txtPwd">
          <input type="button" name="Submit" value="查看用户信息" onClick="return getUserInfo();">
        </div>
    </form>
    </body>
    </html>

    响应页send_json_response.aspx:
    using System;
    using System.Collections.Generic;
    using System.Text;
    using Newtonsoft.Json;
    using System.IO;
    using NUnit.Framework;

    public partial class Ajax_send_json_response : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            string str = string.Empty;
            byte[] bytes = Request.BinaryRead(Request.TotalBytes);
            str = System.Text.Encoding.UTF8.GetString(bytes);

            User u = (User)JavaScriptConvert.DeserializeObject(str, typeof(User));
            if (u.Name.ToLower().Equals("admin") && u.Pwd.ToLower().Equals("admin"))
            {
                Response.Write("管理员");
            }
            else if (u.Name.ToLower().Equals("user") && u.Pwd.ToLower().Equals("user"))
            {
                Response.Write("普通用户");
            }
            else
            {
                Response.Write("输入错误");
             }
        }

        new class User
        {
            private string name;
            private string pwd;

            public string Name
            {
                set { this.name = value; }
                get { return this.name;  }
            }

            public string Pwd
            {
                set { this.pwd = value; }
                get { return this.pwd; }
            }
        }
    }

    注:上例需要json.js,Newtonsoft.Json.dll,nunit.framework.dll.

  • 相关阅读:
    Roce ofed 环境搭建与测试
    Ubuntu 1804 搭建NFS服务器
    Redhat 8.0.0 安装与网络配置
    Centos 8.1 安装与网络配置
    SUSE 15.1 系统安装
    VSpare ESXi 7.0 基本使用(模板、iso、SRIOV)
    VSpare ESXi 7.0 服务器安装
    open SUSE leap 15.1 安装图解
    KVM虚拟机网卡连接网桥
    GitHub Action一键部署配置,值得拥有
  • 原文地址:https://www.cnblogs.com/RobotTech/p/903160.html
Copyright © 2011-2022 走看看