HTML到ASP.net通过JSON通信

HTML to ASP.net Communication through JSON

本文关键字:JSON 通信 通过 net ASP HTML      更新时间:2023-09-26

以下是我的html代码和c#代码。问题是我不能让这些东西工作

——

html代码

   <!doctype html>
    <html lang="en">
   <head>
  <meta charset="utf-8" />
  <title></title>
   <link rel="shortcut icon" type="img/ico" href="Images/favicon.ico"/>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
   <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
   <link rel="stylesheet" href="/resources/demos/style.css" />
   <script type="text/javascript">
        $("#btn_login").live("click", function () {
       var GetLogDet = {};
       GetLogDet.username = document.getElementById('password').value;
       GetLogDet.password = document.getElementById('password').value;
       $.ajax({
           type: 'POST',
           url: 'Login.cs/GetLogDet',
           data: "{GetLogDet:" + JSON.stringify(GetLogDet) + "}",
           contentType: 'application/json; charset=utf-8',
           dataType: 'json',
           success: function (r) {
               alert(r.d.username);
               alert(r.d.password);
           }
       });
   });
   </script>
 <script>
 $(function() {
   $( "#dialog" ).dialog();
  });
  </script>
 </head>
 <body>
  <form id="form1" runat="server">
<div id="dialog" title= " Login" >
 <div>
   <table>
     <tr>
      <td><img src="Images/pics.gif"/></td>
      <td><input type="text" id="username" name="uname"></td>
     </tr>
     <tr>
       <td><img src="Images/pics2.gif" /></td>
       <td><input type="password" id="password" name="pwrd"></td>
     </tr>
       <tr>
       <td></td>
       <td align="right"><input type="button" id="btn_login" class="login" value=">" onclick="searchKeyPress()"></td>
     </tr>
</table>
   </div>
   <div>
  </div>
   </div>
    </form>
  </body>
  </html>

我的c#代码是

 using System;
using System.Collections.Generic;
using System.Linq;
 using System.Web;

public partial class _Default : System.Web.UI.Page
{
    [System.Web.Services.WebMethod]
    public static Login GetLogDet(Login Logindet)
    {
        return Logindet;
    }
}
public class Login
{
    String username, password;
    public String Username
    {
        get
        {
            return username;
        }
        set
        {
            username = value;
        }
    }

    public String Password
    {
        get
        {
            return password;
        }
        set
        {
            password = value;
        }
    }
   }

您需要在document.ready()中包装代码。

同时使用.on()代替.live(),因为.live已被弃用。

$(function()
{
   $( "#dialog" ).dialog();
   $("#btn_login").on("click", function ()
   {
        var GetLogDet = {};
        GetLogDet.username = document.getElementById('password').value;
        GetLogDet.password = document.getElementById('password').value;
        $.ajax(
        {
            type: 'POST',
            url: 'Login.cs/GetLogDet',
            data: "{GetLogDet:" + JSON.stringify(GetLogDet) + "}",
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            success: function (r)
            {
                alert(r.d.username);
                alert(r.d.password);
            }
        });
    });
});

btn_login被限定为在页面完全加载之前点击。应该使用文档。用于绑定此按钮的Ready事件。正如@dipesh所说,使用"on"而不是"live"