首页 技术 正文
技术 2022年11月15日
0 收藏 594 点赞 2,848 浏览 1227 个字

昨天研究ajax,想作个登陆框,无刷新就把用户名密码提交给后台php程序,验证后发回。

几经琢磨 总算出来前台代码:

<script src=”./javascript/jquery-latest.pack.js” type=”text/javascript”></script> //导入jQuery框架文件 要用jQuery必须做此步
<script type=”text/javascript”>
$(document).ready(function(){//这个就是jQueryready ,它就像C语言的main 所有操作包含在它里面
     $(“#button_login”).mousedown(function(){ 
    login(); //点击ID为”button_login”的按钮后触发函数 login();
     });
});

function login(){ //函数 login();
var username = $(“#username”).val();//取框中的用户名
var password = $(“#password1”).val();//取框中的密码

$.ajax({ //一个Ajax过程 
    type: “post”,  //以post方式与后台沟通
    url : “./php_ajax/login.php”, //与此php页面沟通
    dataType:’json’,//从php返回的值以 JSON方式 解释
    data: ‘username=’+username+’&password=’+password, //发给php的数据有两项,分别是上面传来的u和p   
    success: function(json){//如果调用php成功
                        alert(json.username+’\n’+json.password); //把php中的返回值(json.username)给 alert出来
                          }   
           });
}
</script>

具体的php 我只是把代码原封返回,以后该改成到数据库检查。

<?php
echo json_encode(array (‘username’=>$_REQUEST[‘username’],’password’=>$_REQUEST[‘password’]));
?>

json_encode的功能是 把php中的变量组成数组 再封装成Json格式 再echo出来返回给调用它的jquery.ajax()

总的来说 过程是:

用户填完用户名密码 单击按钮“登陆”

jQuery 取得用户名 密码

jQuery把两个变量以post方式发送给login.php

login.php 把变量进行处理 然后把返回封装成Json

把Json抛给 前台页面

前台解释得到的Json数据 并进行下一步处理。

关于Json 就是一种数据封装,类似于XML 但更适合轻量级应用。

相关推荐
python开发_常用的python模块及安装方法
adodb:我们领导推荐的数据库连接组件bsddb3:BerkeleyDB的连接组件Cheetah-1.0:我比较喜欢这个版本的cheeta…
日期:2022-11-24 点赞:878 阅读:9,088
Educational Codeforces Round 11 C. Hard Process 二分
C. Hard Process题目连接:http://www.codeforces.com/contest/660/problem/CDes…
日期:2022-11-24 点赞:807 阅读:5,565
下载Ubuntn 17.04 内核源代码
zengkefu@server1:/usr/src$ uname -aLinux server1 4.10.0-19-generic #21…
日期:2022-11-24 点赞:569 阅读:6,413
可用Active Desktop Calendar V7.86 注册码序列号
可用Active Desktop Calendar V7.86 注册码序列号Name: www.greendown.cn Code: &nb…
日期:2022-11-24 点赞:733 阅读:6,186
Android调用系统相机、自定义相机、处理大图片
Android调用系统相机和自定义相机实例本博文主要是介绍了android上使用相机进行拍照并显示的两种方式,并且由于涉及到要把拍到的照片显…
日期:2022-11-24 点赞:512 阅读:7,822
Struts的使用
一、Struts2的获取  Struts的官方网站为:http://struts.apache.org/  下载完Struts2的jar包,…
日期:2022-11-24 点赞:671 阅读:4,905