django：一个简单的Ajax无刷计算器

最新推荐文章于 2021-08-06 19:12:41 发布

dangfulin

最新推荐文章于 2021-08-06 19:12:41 发布

阅读量252

点赞数 3

分类专栏： Django 文章标签： ajax jquery django

本文链接：https://blog.csdn.net/dangfulin/article/details/108458447

版权

Django 专栏收录该内容

42 篇文章 12 订阅

订阅专栏

这只是一个基础功能模板，更重要的意义在于基于其原理的扩展应用上。

一，路由

MyDjango/urls.py：
from django.urls import path, include
from django.contrib import admin

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include(('user.urls', 'user'), namespace='user')),
]

user/urls.py：
from django.urls import path
from user.views import *

urlpatterns = [
    path('basicexample', basicexample, name='basicexample'),
    path('add', add, name='add'),
]

二，视图

user/views.py：
from django.shortcuts import render
from django.http import HttpResponse

def basicexample(request):
    print(request.GET)
    return render(request, 'test.html')

def add(request):
    a = int(request.GET['a'])
    b = int(request.GET['b'])
    res = str(a + b)
    print('res:', res)
    return HttpResponse(res)

三，模板

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ajax无刷计算器</title>
</head>
<body>
<p>输入两个整数</p>
<form action="add" method="get">
    {% csrf_token %}
    a: <input type="text" id="a" name="a"><br>
    b: <input type="text" id="b" name="b"><br>
    <p>result: <span id="res"></span></p>
    <button type="button" id="sum">求和</button>
</form>
<script src="{% static 'js/jquery-1.11.0.js' %}"></script>
<script>
    $(document).ready(function () {
        $('#sum').click(function () {
            var a = $('#a').val();
            var b = $('#b').val();
            $.ajax({
                url: 'add',
                type: 'GET',
                data: {'a': a, 'b': b},
                success: function (res) {
                    alert("上传成功")
                    $('#res').html(res)
                },
                error: function () {
                    alert("上传失败！")
                    console.log(data)
                }
            })
        });
    });
</script>
</body>
</html>

在这里插入图片描述

dangfulin

关注

3
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
django：一个简单的Ajax无刷计算器

准备知识：jQuery入门。一，路由MyDjango/urls.py：from django.urls import path, includefrom django.contrib import adminurlpatterns = [ path('admin/', admin.site.urls), path('', include(('user.urls', 'user'), namespace='user')),]user/urls.py：from django.
复制链接

扫一扫