博主信息
博文 65
粉丝 3
评论 4
访问量 80648
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
初识ajax-ajax()
无耻的鱼
原创
1057人浏览过
ajax({
    url:目标地址,
    data:发送的数据,
    type:发送的方式,
    sueecss:目标地址返回的数据
})

需要配置本地环境

文件路劲

font

  • ajax.html

  • dome.php

下边看代码

html实例

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ajax</title>
    <style type="text/css">
        div{
            width: 300px;
            margin: auto;
        }
    </style>
</head>
<body>
<div>
            <h2>用户查找</h2>

                <label for="text">用户名:</label>
                <input type="text" name="text" id="text"> 
                                
                <button>验证</button> <br>
                <p></p>
</div>
</body>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript">

    $('button').click (function(){
                    //补充代码与修改---加载提示
                    $(document).ajaxStart(function(){
                            console.log('加载中')
                         })       
            
                        $(document).click (function(){  
                            console.log('加载成功')

            $.ajax({
                url:'dome.php',
                data:{"text":$('#text').val()},
                type:'GET',
                success:function(data){
                    $('p').empty()
                    $("p").append(data)
                }
            })

        
        //禁用默认提交
        return false
    })

            
</script>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

PHP实例

<?php 
// print_r($_GET);exit;
// 用数组模拟数据库中的已存在的用户名,这是不允许使用的
$nameList = ['admin','peter','php'];
//这是当前用户提交的用户名
$userName = $_GET['text'];

//判断用户名是否为空
if (strlen(trim($userName))==0) {
	echo '<span style="color:red">用户名不能为空</span>';
//判断用户名是否为纯数字,这是不允许的
} else if (is_numeric($userName)) {
	echo '<span style="color:red">用户名不能为纯数字</span>';
//判断用户名是否已经被注册
} else if (in_array($userName, $nameList)) {
	echo '<span style="color:red">用户名太抢手了,换一个</span>';
//用户名可用提示
} else {
	echo '<span style="color:green">恭喜,用户名可用</span>';
}

运行实例 »

点击 "运行实例" 按钮查看在线实例

0411.png

批改状态:未批改

老师批语:
本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
作者最新博文
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学