ajax简单页面

简单的注册页面运用ajax

主页面

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="../jquery/jquery-1.11.2.min.js"></script>//首先引用jquery文件
</head>

<body>
<h1>登录页面</h1>

<div>用户名:<input type="text" id="uid" /></div>
<div>密码:<input type="text" id="pwd" /></div>
<input type="button" id="btn" value="登录" />

</body>
<script type="text/javascript">

$("#btn").click(function(){
    //1.取内容
    var uid = $("#uid").val();
    var pwd = $("#pwd").val();
    //2.拿内容去数据库验证
    $.ajax({

        url:"dlchuli.php",//请求地址
        data:{uid:uid,pwd:pwd},//要提交的数据{名称:值}
        type:"POST",//提交的方式
        dataType:"TEXT",//返回类型 dataType中的T必须大写    TEXT字符串 JSON XML
        success: function(data){//回调函数
            //使用data之前,对data进行去空格处理
                if(data.trim()=="OK")//trim()函数是去除前后的空格
                {
                    window.location.href = "main.php";
                }
                else
                {
                    alert("用户名或密码错误!");
                }
            }
        });
    //3.给出提示
    })
</script>

处理页面dlchuli.php

<?php
include("DBDA.class.php");
$db = new DBDA();
$uid = $_POST["uid"];
$pwd = $_POST["pwd"];

$sql = "select pwd from users where uid=‘{$uid}‘";
$arr = $db->Query($sql);

if($arr[0][0]==$pwd && !empty($pwd))//密码相等代表正确,密码为空代表用户名在数据库查找不到
{
    echo "OK";
}
else
{
    echo "NO";
}
时间: 2024-12-23 18:15:46

ajax简单页面的相关文章

Extjs6(三)——用extjs6.0写一个简单页面

本文基于ext-6.0.0 一.关于border布局 在用ext做项目的过程中,最常用到的一种布局就是border布局,现在要写的这个简单页面也是运用border布局来做.border布局将页面分为五个部分,分别是north.south.west.east.center,对应着上.下.左.右.中,下面看一个简单的border布局的例子. Ext.define('Learning.view.treelearn.trees', { extend: 'Ext.panel.Panel', xtype:'

ajax简单登录说明

ajax 简单登录说明: //依据id查找节点 function $(id){ return document.getElementById(id); } //依据id查找节点,然后返回节点的value function $F(id){ return $(id).value; } //获得ajax对象 function getXhr(){ var xhr = null; if(window.XMLHttpRequest){ //非ie xhr= new XMLHttpRequest(); }el

asp.net MVC3 + JQuery 的ajax简单使用

一直都没有使用过JQuery,更没使用过JQuery的ajax支持带来的方便,今天试了一下,真是减少了很多工作量,使用方法也比较简单 这里先记下来,以后使用时可以再拿着用. 本应用中,本来是准备使用长链接的方式,在server端有错误消息产生时,能实时返回错误消息.可在使用长链接时,因为.net功底 不够,以失败告终!所以采用了javascript中间隔查询的方法. 页面代码如下: Java代码   @{ ViewBag.Title = "ErrorMonitor"; } <sc

js+html+css实现简单页面交互功能(2015知乎前端笔试题)http://v.youku.com/v_show/id_XMTI0ODQ5NTAyOA==.html?from=y1.7-1.2

js+html+css实现简单页面交互功能(2015知乎前端笔试题) http://v.youku.com/v_show/id_XMTI0ODQ5NTAyOA==.html?from=y1.7-1.2 密码:hellozhihu

SharePoint 2013 Ajax 造成页面无法编辑

原文:SharePoint 2013 Ajax 造成页面无法编辑 1.如下图,在编辑页面的时候,出现如下错误“此网页自上次打开后已被修改,必须再次打开该网页”,页面上没有什么特别的设置,就是default.aspx: 2.编辑之前页面,只有一个内容编辑器部件,和若干关闭部件,如下图: 3.加上contents=1,进入web部件页维护,关闭我添加的内容编辑器部件,如下图: 4.再次编辑页面,发现OK了: 5.而后发现aspx页面,去掉前台的body.head.等一系列标签,就没问题了,或者直接用

ajax 简单学习

客户端代码function login(type) { $.ajax({ type: "post", url: "logindo.aspx", data: { user: $("#name").val(),//对应<input type="text" id="name"/>的值 pwd:pwd ////对应<input type="password" id="

scrapy实战4抓取ajax动态页面(以糗事百科APP为例子):

一般来说爬虫类框架抓取Ajax动态页面都是通过一些第三方的webkit库去手动执行html页面中的js代码, 最后将生产的html代码交给spider分析.本篇文章则是通过利用fiddler抓包获取json数据分析Ajax页面的具体请求内容,找到获取数据的接口url,直接调用该接口获取数据,省去了引入python-webkit库的麻烦,而且由于一般ajax请求的数据都是结构化数据,这样更省去了我们利用xpath解析html的痛苦. 手机打开糗事百科APP ,利用fiddler抓包获取json数据

js界面刷新&Django使用Ajax实现页面无刷新评论回复功能

Django使用Ajax实现页面无刷新评论回复功能 http://www.cnblogs.com/mfc-itblog/p/5188900.html js界面刷新 http://www.cnblogs.com/dingdingo/archive/2011/10/26/2225307.html js界面刷新&Django使用Ajax实现页面无刷新评论回复功能

HTML与CSS简单页面效果实例

本篇博客实现一个HTML与CSS简单页面效果实例 index.html 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Insert title here</title> 6 <link href="style.css" rel="stylesheet" type="t