python 学习 第九篇 前端应用

简介:

常见的jquery插件,实现前端效果

  模态弹框

学习网址:http://v3.bootcss.com/javascript/#modals

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
< div  class = "modal fade"  id = "changpass" >
   < div  class = "modal-dialog" >
     < div  class = "modal-content" >
       < div  class = "modal-header" >
         < button  type = "button"  class = "close"  data-dismiss = "modal" >< span  aria-hidden = "true" >&times;</ span >< span  class = "sr-only" >Close</ span ></ button >
         < h4  class = "modal-title" >修改密码</ h4 >
       </ div >
                         < form  id = "passwdForm"  class = "form-horizontal" >
                                 < input  type = "hidden"  name = "id"  id = "passwdid" >
 
                             < div  class = "form-group" >
                                 < label  for = "password"  class = "col-sm-2 control-label" >新密码< span  class = "red-fonts" ></ span ></ label >
                                 < div  class = "col-sm-8" >
                                     < input  id = "password"  name = "password"  type = "password"  class = "form-control" >
                                 </ div >
                             </ div >
 
                             < div  class = "form-group" >
                                 < label  for = "re_password"  class = "col-sm-2 control-label" >确认密码</ label >
                                 < div  class = "col-sm-8" >
                                     < input  id = "re_password"  name = "re_password"  type = "password"  class = "form-control" >
                                 </ div >
                             </ div >
 
                         < div  class = "modal-footer" >
                                 < button  type = "button"  class = "btn btn-default"  data-dismiss = "modal" >取消</ button >
                                 < button  type = "button"  class = "btn btn-primary"  id = "chpass" >确认</ button >
                         </ div >
                 </ form >
     </ div > <!-- /.modal-content -->
   </ div > <!-- /.modal-dialog -->
</ div > <!-- /.modal -->


jquery部分代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
     $("#chpass").click(function () {
         $.post("/modpasswd",$("#passwdForm").serialize(),function (data) {
             data=JSON.parse(data)
             if(data["code"]==0){
                  swal({
                     title:'修改成功',
                     text:"success",
                     type:'success',
                     },function(){
                         location.reload()
                     })
             }else{
                 swal('Error',data['errmsg'],'error')
             }
         })
     })

效果图

wKioL1f6E3XyTb-bAAAk1Q73xSQ862.png

sweetalert弹出信息

wKiom1f6FCviPmOFAAA2HTYWb6I742.png

datatable美化表格

学习网址:https://datatables.net/

jquery代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
$('#editable').DataTable({
     'bDestory': true,
     "language": {
         "lengthMenu": "每页 _MENU_ 条记录",
         "zeroRecords": "没有找到记录",
         "sInfo": "第 _PAGE_ 页 ( 总共 _PAGES_ 页 ),显示第 _START_ 至 _END_ 项(总共 _TOTAL_ 项)",
         "infoEmpty": "无记录",
         "infoFiltered": "(从 _MAX_ 条记录过滤)",
         "sSearch": "搜索:",
         "oPaginate": {
         "sFirst": "首页",
         "sPrevious": "上一页",
         "sNext": "下一页",
         "sLast": "末页"
         }
     },
     "order": [[ 0,"asc" ]]
});

效果图

wKioL1f6FPnziKUQAABhOvzQOJs922.png



本文转自 shouhou2581314 51CTO博客,原文链接:http://blog.51cto.com/thedream/1859901,如需转载请自行联系原作者

相关文章
|
10天前
|
机器学习/深度学习 存储 数据挖掘
Python图像处理实用指南:PIL库的多样化应用
本文介绍Python中PIL库在图像处理中的多样化应用,涵盖裁剪、调整大小、旋转、模糊、锐化、亮度和对比度调整、翻转、压缩及添加滤镜等操作。通过具体代码示例,展示如何轻松实现这些功能,帮助读者掌握高效图像处理技术,适用于图片美化、数据分析及机器学习等领域。
49 20
|
1月前
|
Python 容器
Python学习的自我理解和想法(9)
这是我在B站跟随千锋教育学习Python的第9天,主要学习了赋值、浅拷贝和深拷贝的概念及其底层逻辑。由于开学时间紧张,内容较为简略,但希望能帮助理解这些重要概念。赋值是创建引用,浅拷贝创建新容器但元素仍引用原对象,深拷贝则创建完全独立的新对象。希望对大家有所帮助,欢迎讨论。
|
7天前
|
Dart 前端开发 架构师
【01】vs-code如何配置flutter环境-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈-供大大的学习提升
【01】vs-code如何配置flutter环境-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈-供大大的学习提升
|
24天前
|
算法 数据处理 Python
高精度保形滤波器Savitzky-Golay的数学原理、Python实现与工程应用
Savitzky-Golay滤波器是一种基于局部多项式回归的数字滤波器,广泛应用于信号处理领域。它通过线性最小二乘法拟合低阶多项式到滑动窗口中的数据点,在降噪的同时保持信号的关键特征,如峰值和谷值。本文介绍了该滤波器的原理、实现及应用,展示了其在Python中的具体实现,并分析了不同参数对滤波效果的影响。适合需要保持信号特征的应用场景。
102 11
高精度保形滤波器Savitzky-Golay的数学原理、Python实现与工程应用
|
27天前
|
Python
Python学习的自我理解和想法(10)
这是我在千锋教育B站课程学习Python的第10天笔记,主要学习了函数的相关知识。内容包括函数的定义、组成、命名、参数分类(必须参数、关键字参数、默认参数、不定长参数)及调用注意事项。由于开学时间有限,记录较为简略,望谅解。通过学习,我理解了函数可以封装常用功能,简化代码并便于维护。若有不当之处,欢迎指正。
|
18天前
|
数据可视化 数据挖掘 大数据
1.1 学习Python操作Excel的必要性
学习Python操作Excel在当今数据驱动的商业环境中至关重要。Python能处理大规模数据集,突破Excel行数限制;提供丰富的库实现复杂数据分析和自动化任务,显著提高效率。掌握这项技能不仅能提升个人能力,还能为企业带来价值,减少人为错误,提高决策效率。推荐从基础语法、Excel操作库开始学习,逐步进阶到数据可视化和自动化报表系统。通过实际项目巩固知识,关注新技术,为职业发展奠定坚实基础。
|
1月前
|
存储 索引 Python
Python学习的自我理解和想法(6)
这是我在B站千锋教育学习Python的第6天笔记,主要学习了字典的使用方法,包括字典的基本概念、访问、修改、添加、删除元素,以及获取字典信息、遍历字典和合并字典等内容。开学后时间有限,内容较为简略,敬请谅解。
|
1月前
|
Python
Python学习的自我理解和想法(7)
学的是b站的课程(千锋教育),跟老师写程序,不是自创的代码! 今天是学Python的第七天,学的内容是集合。开学了,时间不多,写得不多,见谅。
|
1月前
|
存储 安全 索引
Python学习的自我理解和想法(8)
这是我在B站千锋教育学习Python的第8天,主要内容是元组。元组是一种不可变的序列数据类型,用于存储一组有序的元素。本文介绍了元组的基本操作,包括创建、访问、合并、切片、遍历等,并总结了元组的主要特点,如不可变性、有序性和可作为字典的键。由于开学时间紧张,内容较为简略,望见谅。
|
1月前
|
存储 索引 Python
Python学习的自我理解和想法(4)
今天是学习Python的第四天,主要学习了列表。列表是一种可变序列类型,可以存储任意类型的元素,支持索引和切片操作,并且有丰富的内置方法。主要内容包括列表的入门、关键要点、遍历、合并、判断元素是否存在、切片、添加和删除元素等。通过这些知识点,可以更好地理解和应用列表这一强大的数据结构。
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等