Question

我从某个网站的登录页面代码中获取灵感。我找到了一个我不知道如何实现的功能。

该登录页面在表单中使用两个输入控件来收集用户名和密码：

<form method="post" runat="server" action="myLogin.aspx">

    <input type="text" class="us_name" name="txtUserName" id="txtUserName" value="" />

    <input type="password" class="us_pwd" name="txtPassword" id="txtPassword" value="" />
</form>

在那个页面中，我也发现了一些像这样的JQuery代码：

 <script language="javascript" type="text/javascript">
     $(document).ready(function () {
         var error = 0;
         if (error > 0) {
             switch (error) {
                 case 1:
                     $("#ListMsg").html("username and pwd can not be empty");
                     $("#txtUserName").focus();
                     break;
                 case 2:
                     $("#ListMsg").html("Pic code can not be empty");
                     $("#txtCheckCode").focus();
                     break;
                 case 3:
                     $("#ListMsg").html("Pic code err");
                     $("#txtCheckCode").focus();
                     break;
                 case 36006:
                     $("#ListMsg").html("username err");
                     $("#txtCheckCode").focus();
                     break;
                 case 36007:
                     $("#ListMsg").html("password err");
                     $("#txtCheckCode").focus();
                     break;
                 case 20012:
                     $("#ListMsg").html("account is lock");
                     $("#txtCheckCode").focus();
                     break;
                 case 10007:
                     $("#ListMsg").html("can not access");
                     $("#txtCheckCode").focus();
                     break;
                 default:
                     $("#ListMsg").html("username or password err");
                     $("#txtPassword").focus();
                     break;
             }
         }
     });

上面的代码似乎是在登录失败时显示错误消息，但请注意以下声明：

    var error = 0;

当我输入错误的密码并查看页面来源时，我发现它已自动更改为：

    var error = 36007;

我猜这个变量必须在登录失败时由服务器端代码更改，并用它来表示失败原因。但我不知道服务器如何设置客户端JQuery变量的值，有人可以举个例子吗？

Answer 1

您可以使用ajax来促进脚本和php服务器之间的通信，而无需更改页面。当用户点击登录按钮时，您可以将他/她的输入值作为ajax帖子发送。请考虑以下示例：

$( '#btn-login' ).click( function () {
     $.ajax({
          url: "your.server.address/function_that_sends_those_codes",
          data: {
                    userID: $( '#txtUserName' ).val(),
                    pwd: $( '#txtPassword' ).val()
                },
          type: 'POST',
          dataType: 'JSON',

          success: function ( response ) {
                                    error = response.errCode; //or whatever your server
                                                              //sends
                                },
          error: function ( errorMsg ) {
                                    console.log( errorMsg );
                             }
     });
});

在您的PHP代码中，您检索使用$_POST[ 'userID' ]和$_POST[ 'pwd' ]发送的数据。您通过与数据库交互来计算代码，并执行此操作：

echo json_encode( array( yourErrorCode ) );

＆＃39; yourErrorCode＆＃39;被发送为“回复”＃39;为了你的成功＆＃39;回调函数。您可以在浏览器的控制台中查看收到的响应或引发的任何错误。

快乐的编码：）

Answer 2

要从代码后面设置javascript变量，您可以注册client script。像这样：

 ScriptManager.RegisterStartupScript(this, this.GetType(), "", "error = 36007;", true);

如何从服务器端更改客户端javascript的变量？

2 个答案: