加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

jqury+ajax+php最简单的例子局部刷新页面

发布时间:2020-12-16 00:17:19 所属栏目:百科 来源:网络整理
导读:研究ajax,想作个登陆框,无刷新就把用户名密码提交给后台php程序,验证后发回。 几经琢磨 总算出来前台代码: script src="./javascript/jquery-latest.pack.js" type="text/javascript"/script //导入jQuery框架文件 要用jQuery必须做此步 script type="te

研究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 但更适合轻量级应用。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读