下面是一个 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. Navicat工具的使用 2

    再双击t1表 进入表 往里面填数据插记录就可以了 tab键往下行 新建一张dep表 部门表 #4. 设计表:外键 新建dep表 员工表新增dep_id 做外键 #5. 新建查询 可以直接在这里查询,不 ...

  2. 20190316 Python - Pandas

    1. python 安装3.7版本 2. 第三方包进行数据加工和呈现 需要注意的是,你安装过程中会有很多依赖包问题,如果网络异常,那么就使用https://pypi.org/   地址去找对应的包下载 ...

  3. ansible进阶模板和角色使用

    使用场景 Ansible 由于采用ssh远程连接登录管理,虽然不需要额外安装agent,但是速度慢效率低.不适合管理大规模的主机一般最大规模在200-300台,超大规模的主机管理适合使用puppet ...

  4. LigerUi遮罩的两个方法

    $.ligerDialog.waitting('正在查询,请稍候...'); $.ligerDialog.close();

  5. PinyinUtil

    import java.util.HashSet;import java.util.Set;import java.util.regex.Matcher;import java.util.regex. ...

  6. python基本运算符、比较运算符、赋值运算符、逻辑运算符

    # 基本运算符号: " + - * / % ** //" # a=20# b=30## print(a+b) #相加 当是: "+" a+b输出的结果:50## ...

  7. （转）EOS中账户、钱包和密钥的关系

    EOS对于账户的设计与ETH有很大的不同,引入了Account账户, Wallet钱包, 钱包密码, Key公私钥, Permission权限等众多概念,刚入门的时候感觉一头雾水.本文希望通过对这些概 ...

  8. ANSI码和UNICODE码

    什么是ANSI,什么又是UNICODE呢? 其实这是两种不同的编码方式标准,ANSI中的字符采用8bit,而UNICODE中的字符采用16bit. (对于字符来说ANSI以单字节存放英文字符,以双字节 ...

  9. [LeetCode] 154. Find Minimum in Rotated Sorted Array II_Hard

    Suppose an array sorted in ascending order is rotated at some pivot unknown to you beforehand. (i.e. ...

  10. Win10 JDK 配置

    分两行建,点击新建, %JAVA_HOME%\bin %JAVA_HOME%\jre\bin