下面是一个 ajax 检测用户名是否可用的例子。

django  项目中。

—— views.py 里——

from django.shortcuts import render,HttpResponse

from django.views.decorators.csrf import ensure_csrf_cookie

from app01 import models

from django.http import JsonResponse

@ensure_csrf_cookie

def reg(request):    # 注册

    return render(request,'reg.html')

def check(request):   # 检测用户名是否可用

    user = request.POST.get('user')

    ret  = models.User.objects.filter(name=user)

    if ret:

        return JsonResponse({'status':1,'msg':'用户名已存在'})

    else:

        return JsonResponse({'status':0,'msg':'可用的用户名'})
—— reg.html 里——

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>reg</title>

</head>

<body>

<p>用户名

    <input type="text" name="user"><span></span></p>

<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>

<script src="/static/js/ajax_setup.js"></script>

<script>

    $('[name="user"]').blur(function () {

        _this = $(this);

        {#alert($('[name = "user"]').val());#}

        $.ajax({

            url: '/check/',

            type: 'post',

            data: {

                user: $('[name="user"]').val(),

                {#属性选择器#}

            },

            success: function (res) {

                _this.next().text(res.msg)

            }

        })

    }).focus(function () {

        _this.next().text('')

    });   {#链式操作#}

</script>

</body>

</html>

另一种Js 代码:
<script>
    $('[name="user"]').blur(function () {
       　　$.ajax({
            url: '/check/',
            type: 'post',
            data: {'user': $('[name="user"]').val()},
            success: (res) => {              #箭头的使用
                $(this).next().text(res.msg)
            }
        })
    }).focus(function () {
        $(this).next().text('')
    })
</script>
其他:
-- models.py --

from django.db import models

class User(models.Model):

    name = models.CharField(max_length=22)  # varchar

-------------------------------------------
-- urls.py --

from django.conf.urls import url

from django.contrib import admin

from app01 import views

urlpatterns = [

    url(r'^admin/', admin.site.urls),

    url(r'^reg/', views.reg),

    url(r'^check/', views.check),]

-------------------------------------------
-- settings.py --
STATIC_URL = '/static/'

STATICFILES_DIRS = [

    os.path.join(BASE_DIR,'static')]

ajax 检测用户名是否可用的更多相关文章

  1. asp.net ajax 检测用户名是否可用代码

    原文  asp.net ajax 检测用户名是否可用代码 .net ajax 检测用户名是否可用代码 <script type="text/网页特效" src="c ...

  2. Ajax检测用户名是否已经注册

    程序功能 当用户名输入完成(即用户名输入框失去焦点),利用Ajax检测用户名是否已经注册! 实现过程 利用Ajax向CheckUserServlet发送请求,判断该用户名是否可用.这里只是为了演示Aj ...

  3. 11月10日上午ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库

    1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...

  4. ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库

    1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...

  5. 14.ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库

    1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...

  6. Ajax校验用户名是否可用

    准备 导包:DBUtil,JDBC,C3P0 在src下导入c3p0-config.xml 导入JDBCUtil 创建数据库 第2.3.条查看https://blog.csdn.net/weixin_ ...

  7. php运用validate+ajax检测用户名是否已存在

    前提:如果还不知道什么是validate,请前往这里 一.remote rules: username:{ required:true, minlength:8, maxlength:8, remot ...

  8. thinkphp ajax检测是否数据可用

    模板文件:如 index.html 模板文件如:(index.html) <form><input type="text" name="username ...

  9. Django ajax 检测用户名是否已被注册

    添加一个 register.html 页面 <!DOCTYPE html> <html lang="en"> <head> <meta c ...

随机推荐

  1. 前端 HTML 标签里 特殊符号

    特殊符号 浏览器在显示的时候会移除源代码中多余的空格和空行. 所有连续的空格或空行都会被算作一个空格.需要注意的是,HTML代码中的所有连续的空行(换行)也被显示为一个空格. <!DOCTYPE ...

  2. 如何修改帝国cms文章点击量默认值和成倍增加

    我们在帝国cms发布完文章,在不点击的情况下,“点击量”默认显示为0,请问有什么方法,修改关注默认值吗?这个可以在增加信息时,“特殊属性”标签里修改点击量,如下图 有朋友问有没其他好的方法快速增加.成 ...

  3. 火币网API文档——WebSocket API简介

    WebSocket API简介 WebSocket协议是基于TCP的一种新的网络协议.它实现了客户端与服务器之间在单个 tcp 连接上的全双工通信,由服务器主动发送信息给客户端,减少了频繁的身份验证等 ...

  4. IE无法安装Activex控件

    由于无法验证发行者,所以windows已经阻止此软件,如要安装未签名的activex控件,按如下步骤: 1.打开Internet Explorer---菜单栏点“工具”---Internet选项--安 ...

  5. jvm - 类的初始化过程

    我们知道,我们写的java代码称为源码,想要能够被jvm执行首先需要编译成.class文件,那么编译完到使用又都经理的哪些阶段呢?主要分为以下三个阶段: 加载:查找并加载类的二进制数据(.class文 ...

  6. maven 转myeclipse eclipse 项目 命令

    我们在网上下载的开源Maven工程想要转换成Eclipse能够识别的工程,需要执行如下命令: Jar工程: mvn eclipse:eclipse 或 mvn eclipse:myeclipse We ...

  7. openshift 容器云从入门到崩溃之三《安装openshift》

    准备好环境,在安装之前请先了解openshift提供的ansible有大量的安装选项 文档地址:https://docs.okd.io/latest/install/configuring_inven ...

  8. 【LeetCode每天一题】String to Integer (atoi)(字符串转换成数字)

    Implement atoi which converts a string to an integer.The function first discards as many whitespace ...

  9. [Java in NetBeans] Lesson 16. Exceptions.

    这个课程的参考视频和图片来自youtube. 主要学到的知识点有: We want to handle the bad Error. (e.g bad input / bugs in program) ...

  10. leetcode 22括号生成

    非常好的一道题.一开始的思想是这样的,先把n对括号按照某一顺序生成一个string,然后用全排列算法生成所有可能,然后利用stack写一段判断括号是否匹配的字符串,匹配的假如结果中.不过会超时.因为全 ...