python Django 学习笔记 2020-11-6（input不显示提示信息，日历，datetime类型数据的显示，使用装饰器实现登录限制，文字下划线）

最新推荐文章于 2023-02-23 01:04:31 发布

我肚子好饿

最新推荐文章于 2023-02-23 01:04:31 发布

阅读量1.3k

点赞数

分类专栏： python web

本文链接：https://blog.csdn.net/qq_36780295/article/details/109484541

版权

python 同时被 2 个专栏收录

25 篇文章 2 订阅

订阅专栏

web

12 篇文章 0 订阅

订阅专栏

1、input不显示提示信息

在这里插入图片描述

添加属性autocomplete="off"。如：

<input type="text" class="input-define" id="input" 
       autocomplete="off" placeholder="请选择" style="width:100%;"/>

2、下拉复选框内容获取和截取内容字符串

接着上一篇做好的下拉复选框，下拉复选框代码地址：https://blog.csdn.net/qq_36780295/article/details/109454195
这里演示使用。

获取下拉复选框的内容：

#html中，为下拉复选框的input添加name
<input type="text" class="input-define" id="input-define" name="select_participate" 
                   autocomplete="off" placeholder="请选择" style="width:100%;"/>
#在views.py中接收
select_participate_member = request.POST.get("select_participate", None)

由于接收到的下拉复选框的内容是“内容+逗号”的格式，无法直接使用，所以写了一个截取元素到数组的代码放在下面。

截取字符：
获取到的内容可以通过逗号来定位：

def ele_index(arr, ele):
    i=0
    for i in range(len(arr)):
        if arr[i] == ele:
            break
    return i
    
def str_arr(arr):
    star = []
    while len(arr):
        t = ele_index(arr,',')
        star.append(arr[0:t])
        arr = arr[t+1:]
    return star

t = 'jcy1号,jcy2号,jcy3号,'
print(str_arr(t))

输出结果：
在这里插入图片描述

3、css中边框显示

写在style中：

border-top:1px #000000 solid;        /*上边框*/
border-left: 1px #000000 solid;      /*左边框*/
border-right:1px #000000 solid;      /*右边框*/
border-bottom:1px #000000 solid;     /*下边框*/

4、好看的日历

代码来自：https://www.cnblogs.com/zhsh666/p/11380873.html

在head中style中添加：

        .calendar{
	        width:450px;
	        height:350px;
	        background:#fff;
	        box-shadow:0px 1px 1px rgba(0,0,0,0.1);
        }
        .body-list ul{
	        width:100%;
	        font-family:arial;
	        font-weight:bold;
	        font-size:14px;
        }
        .body-list ul li{
	        width:14.28%;
	        height:36px;
	        line-height:36px;
	        list-style-type:none;
        	display:block;
        	box-sizing:border-box;
	        float:left;
	        text-align:center;
        }
        .lightgrey{
	        color:#a8a8a8; /*浅灰色*/
        }
        .darkgrey{
	        color:#565656; /*深灰色*/
        }
        .green{
	        color:#6ac13c; /*绿色*/
        }
        .greenbox{
	        border:1px solid #6ac13c;
	        background:#e9f8df; /*浅绿色背景*/
        }

在布局中添加：

                   <div class="calendar">
                        <div class="w" style="margin-top:-20px">
                            <h1 class="green" id="calendar-title" style="text-align:center;">Month</h1>
                            <h2 class="green small" id="calendar-year" style="text-align:center;margin-top:-6px">Year</h2>
                            <a href="" id="prev" style="float:left;">
                                <img src=" /static/icon/back.png">
                            </a>
                            <a href="" id="next" style="float:right;">
                                <img src=" /static/icon/forward.png">
                            </a>
                        </div>
                        <div class="body" style="margin-top:40px">
                            <div class="lightgrey body-list">
                                <ul>
                                    <li>MON</li>
                                    <li>TUE</li>
                                    <li>WED</li>
                                    <li>THU</li>
                                    <li>FRI</li>
                                    <li>SAT</li>
                                    <li>SUN</li>
                                </ul>
                            </div>
                            <div class="darkgrey body-list">
                                <ul id="days">
                                </ul>
                            </div>
                        </div>
                    </div>

在末尾增加javascript：

var month_olympic = [31,29,31,30,31,30,31,31,30,31,30,31];
var month_normal = [31,28,31,30,31,30,31,31,30,31,30,31];
var month_name = ["January","Febrary","March","April","May","June","July","Auguest","September","October","November","December"];

var holder = document.getElementById("days");
var prev = document.getElementById("prev");
var next = document.getElementById("next");
var ctitle = document.getElementById("calendar-title");
var cyear = document.getElementById("calendar-year");

var my_date = new Date();
var my_year = my_date.getFullYear();
var my_month = my_date.getMonth();
var my_day = my_date.getDate();

//获取某年某月第一天是星期几
function dayStart(month, year) {
	var tmpDate = new Date(year, month, 1);
	return (tmpDate.getDay());
}

//计算某年是不是闰年，通过求年份除以4的余数即可
function daysMonth(month, year) {
	var tmp = year % 4;
	if (tmp == 0) {
		return (month_olympic[month]);
	} else {
		return (month_normal[month]);
	}
}

function refreshDate(){
	var str = "";
	var totalDay = daysMonth(my_month, my_year); //获取该月总天数
	var firstDay = dayStart(my_month, my_year); //获取该月第一天是星期几
	var myclass;
	for(var i=1; i<firstDay; i++){
		str += "<li></li>"; //为起始日之前的日期创建空白节点
	}
	for(var i=1; i<=totalDay; i++){
		if((i<my_day && my_year==my_date.getFullYear() && my_month==my_date.getMonth()) || my_year<my_date.getFullYear() || ( my_year==my_date.getFullYear() && my_month<my_date.getMonth())){
			myclass = " class='lightgrey'"; //当该日期在今天之前时，以浅灰色字体显示
		}else if (i==my_day && my_year==my_date.getFullYear() && my_month==my_date.getMonth()){
			myclass = " class='green greenbox'"; //当天日期以绿色背景突出显示
		}else{
			myclass = " class='darkgrey'"; //当该日期在今天之后时，以深灰字体显示
		}
		str += "<li"+myclass+">"+i+"</li>"; //创建日期节点
	}
	holder.innerHTML = str; //设置日期显示
	ctitle.innerHTML = month_name[my_month]; //设置英文月份显示
	cyear.innerHTML = my_year; //设置年份显示
}
refreshDate(); //执行该函数

prev.onclick = function(e){
	e.preventDefault();
	my_month--;
	if(my_month<0){
		my_year--;
		my_month = 11;
	}
	refreshDate();
}
next.onclick = function(e){
	e.preventDefault();
	my_month++;
	if(my_month>11){
		my_year++;
		my_month = 0;
	}
	refreshDate();
}

切页素材：
在这里插入图片描述

运行结果：
在这里插入图片描述

5、datetime数据类型显示时转换

代码和结果来自：https://blog.csdn.net/weixin_38818092/article/details/87924571

from datetime import datetime,date,time
dt=datetime(2019,2,24,14,53,26)
print(dt.year)
print(dt.month)
print(dt.day)
print(dt.hour)
print(dt.minute)
print(dt.second)
print(dt.date)
print(dt.time)
print(dt.strftime('%m/%d/%Y/ %H:%M'))
print(dt.strftime('%F'))
print(dt.strftime('%D'))
print(dt.strptime('20190224150700','%Y%m%d%H%M%S'))

输出结果：

2019
2
24
14
53
26
<built-in method date of datetime.datetime object at 0x000002499CD26968>
<built-in method time of datetime.datetime object at 0x000002499CD26968>
02/24/2019/ 14:53
2019-02-24
02/24/19
2019-02-24 15:07:00

由此，当在models中数据存储格式为datetime时，当我们只想单独获取该日期或者时间时，只需要：

# 获取datetime的日期部分
submit_items = models.CreateItem.objects.filter(duty_peo='jcy')
print(submit_items[0].create_date_time.strftime('%F'))

# 获取datetime的时间部分
submit_items = models.CreateItem.objects.filter(duty_peo='jcy')
print(submit_items[0].create_date_time.strftime('%H:%M:%S'))

调整datetime在html中显示格式：
将数据库中datetime类型数据查出来显示在前端是这样的：
在这里插入图片描述
为了使其显示为我们经常看到的样式，需要添加代码：

<td>{{sub_items.submit_date|date:"Y-m-d H:i:s"}}</td>

在这里插入图片描述

6、下拉全选和单选实现查询

下拉框单选和全选时：
在这里插入图片描述
如果选全部就将查询的值设为空，然后再进行模糊查询匹配就行了。

if select_item == '全部':
    select_item = ''
submit_items = models.SubmitItem.objects.filter(item_name__startswith=select_item)

7、使用装饰器实现登录限制

实现不登陆就无法直接通过网站访问。

参考自：https://www.cnblogs.com/weilaibuxiangshuo/p/10412124.html

# 在views.py中引入method_decorator
from django.utils.decorators import method_decorator
# 添加登陆验证函数
def checklogin(func):
    def wrapper(request, *args, **kwargs):
        is_login = request.session.get('IS_LOGIN', False)
        if is_login:
            return func(request, *args, **kwargs)
        else:
            return redirect('/login/')            #未登录跳转的页面
    return wrapper
# 在数据库查表验证登录的代码中添加session
class LoginView(View):
    @classmethod
    def post(cls, request):
        if request.method == 'GET':
            return render(request, 'login.html', )
        elif request.method == 'POST':
            username = request.POST.get("username")
            password = request.POST.get("pwd")
            user_obj = models.User.objects.filter(username=username, password=password).first()
            if user_obj:
                # 添加此处代码
                request.session['IS_LOGIN'] = True
                request.session['uname'] = user_obj.username
                # 添加此处代码
                if username == "jcy":   # 管理员
                    return redirect("/index1/")    
                else:       # 非管理员
                    return redirect("/index2/")    
            else:
                request.session.flush()
                error_msg = "用户名或密码错误"
                return render(request, "login.html", {"error": error_msg})
# 在页面跳转的方法前添加装饰器，如：
@method_decorator(checklogin)

然后再使用网址登录添加了装饰器的页面时就会跳转到登陆页面，直到完成登录，登陆完的跳转页面就是自己定义的页面。

想要注销登录，可以使用按钮绑定功能添加：request.session.flush()。

此外request.session['uname']中保存了已登陆的用户名，可以在其他类中进行使用，比如区分不同的登录用户。

8、按钮文字修改颜色、添加下划线

style="color:blue;text-decoration:underline;"

我肚子好饿

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
python Django 学习笔记 2020-11-6（input不显示提示信息，日历，datetime类型数据的显示，使用装饰器实现登录限制，文字下划线）

input不显示提示信息添加属性autocomplete="off"。如：<input type="text" class="input-define" id="input" autocomplete="off" placeholder="请选择" style="width:100%;"/>下拉复选框内容获取和截取内容字符串获取下拉复选框的内容：#html中，为下拉复选框的input添加name<input type="text" class="input-
复制链接

扫一扫

专栏目录