Django学习------使用Django制作一个简易计算器页面

文章预览

    • 1、创建Django项目
    • 2、views.py文件
    • 3、urls.py文件
    • 4、html页面
    • 5、运行结果

最近在学习Django后台开发,以一个简单的页面来记录一下知识点

1、创建Django项目

项目结构如下
Django学习------使用Django制作一个简易计算器页面_第1张图片
配置服务器
Django学习------使用Django制作一个简易计算器页面_第2张图片

2、views.py文件

#!/usr/bin/env python 
# -*- coding:utf-8 -*-
from django.http import HttpResponse
from django.shortcuts import render
# 计算器
def test_mycount(request):
    if request.method == 'GET':
        return render(request,'computer.html')
    elif request.method == 'POST':
        #处理计算
        x = int(request.POST['x'])
        y = int(request.POST['y'])
        op = request.POST['op']

        result = 0
        if op == 'add':
            result = x + y
        elif op == 'sub':
            result = x - y
        elif op == 'mul':
            result = x * y
        elif op == 'div':
            result = x / y
        return render(request,'computer.html',locals())   #locals()表示将原本请求的数据重新返回


3、urls.py文件

from django.contrib import admin
from django.urls import path
from djangoProject import views

urlpatterns = [
    path('admin/', admin.site.urls),
    path('count',views.test_mycount)
]

4、html页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>计算器</title>
</head>
<body>
<form action="/count" method="post">
    <input type="text" name="x" value="{{ x }}">
    <select name="op">
        <option value="add" {% if op == 'add' %}selected{% endif %}>+</option>
        <option value="sub" {% if op == 'sub' %}selected{% endif %}>-</option>
        <option value="mul" {% if op == 'mul' %}selected{% endif %}>*</option>
        <option value="div" {% if op == 'div' %}selected{% endif %}>/</option>
    </select>
    <input type="text" name="y" value="{{ y }}">=
    <span>{{ result }}</span>
    <div><input type="submit" value="开始计算"></div>
</form>
</body>
</html>

5、运行结果

Django学习------使用Django制作一个简易计算器页面_第3张图片
Django学习------使用Django制作一个简易计算器页面_第4张图片
Django学习------使用Django制作一个简易计算器页面_第5张图片
Django学习------使用Django制作一个简易计算器页面_第6张图片

你可能感兴趣的:(Django,django,python,后端)