当前位置：首页 > Web开发 > 正文

Type前后端传输数据编码格局, Ajax发送文件数据, django内置的序列化成果, Ajax结合

2024-03-31 Web开发

多对多三种创建方法

1.全自动(较为常用)

class Book(models.Model): title = models.CharField(max_length=32) authors = models.ManyToManyField(to=‘Author‘) # orm就会自动帮你创建第三张表 class Author(models.Model): name = models.CharField(max_length=32) ‘‘‘ 好处：第三张表本身创建不敷之处：第三张表无法扩展特别的字段 ‘‘‘

2.纯手动(了解)

class Book(models.Model): title = models.CharField(max_length=32) class Author(models.Model): name = models.CharField(max_length=32) class Book2Author(models.Model): book = models.ForeignKey(to=‘Book‘) author = models.ForeignKey(to=‘Author‘) create_time = models.DateField(auto_now_add=True) """ 好处在于第三表可以扩展特别的字段不敷之处:orm盘问的时候会带来未便 """

3.半自动(保举)

class Book(models.Model): title = models.CharField(max_length=32) authors = models.ManyToManyField(to=‘Author‘, through=‘Book2Author‘, through_fields=(‘book‘, ‘author‘)) class Author(models.Model): name = models.CharField(max_length=32) books = models.ManyToManyField(to=‘Author‘, through=‘Book2Author‘, through_fields=(‘author‘, ‘book‘)) class Book2Author(models.Model): book = models.ForeignKey(to=‘Book‘) author = models.ForeignKey(to=‘Author‘) create_time = models.DateField(auto_now_add=True) """ 好处在于第三步可以扩展任意的特别字段还可以操作orm 正反向盘问不敷之处:无法操作 add set remove clear 虽然无法使用了但是你还可以本身直接操纵第三表 """

Ajax（异步提交、局部刷新）

同步与异步

同步　　任务提交之后原地期待任务的返回功效进程表示上来说梗阻

异步　　任务提交之后不需要原地期待返回功效直接执行下一行代码担任表示上来说非梗阻任务的功效必定是需要的是通过异步回调机制 callback()

与后端进行交互的方法

1.浏览器窗口输入url回车　　　　GET

2.a标签href属性填写url点击　　 GET

3.form表单　　　　　　　　　　GET/POST

4.Ajax　　　　　　　　　　　　GET/POST

Ajax并不是一门新的语言它其实就是基于js写的一个成果模块而已

由于原生js书写ajax较为繁琐所以我们直接学jQuery封装好的ajax模块操纵

初识ajax

案例：页面上有三个input框一个按钮

用户在前两个框中输入数字点击按钮保证页面不刷新的情况下将数据发到后端做计算

将计算好的功效再发给前端展示到第三个input框中

ajax根基语法布局

// ajax根基语法 $.ajax({ // 1.到底朝哪个后端提交数据 url:‘‘, // 控制数据的提交路径有三种写法跟form表单的action属性一致 // 2.指定当前请求方法 type:‘post‘, // 3.提交的数据 data:{‘i1‘:$(‘#i1‘).val(),‘i2‘:$(‘#i2‘).val()}, // 4.ajax是异步提交所以需要给一个回调函数来措置惩罚惩罚返回的功效 success:function (data) { // data就是异步提交的返回功效 // 将异步回调的功效通过DOM操纵衬着到第三个input框中 $(‘#i3‘).val(data) } })

例：

templates/index.html

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> <link href="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet"> <script src="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script> </head> <body> <input type="text" id="i1"> + <input type="text" id="i2"> = <input type="text" id="i3"> <button id="d1">按钮</button> <script> $(‘#d1‘).click(function () { // 获取两个框里面内容朝后端提交异步请求 // ajax根基语法 $.ajax({ // 1.到底朝阿谁后端提交数据 url:‘‘, // 控制数据的提交路径有三种写法跟form表单的action属性一样 // 2.指定当前请求方法 type:‘post‘, // 3.提交的数据 data:{‘i1‘:$(‘#i1‘).val(),‘i2‘:$(‘#i2‘).val()}, // 4.ajax是异步提交所以需要给一个回调函数来措置惩罚惩罚返回的功效 success:function (data) { // data就是异步提交的返回功效 // 将异步回调的功效通过DOM操纵衬着到第三个input框中 $(‘#i3‘).val(data) } }) }) </script> </body> </html>

app01/views.py

温馨提示: 本文由Jm博客推荐，转载请保留链接: https://www.jmwww.net/file/web/31680.html

上一篇：可能是因为你使用的是fastJson
下一篇：web项目目录布局

Type前后端传输数据编码格局, Ajax发送文件数据, django内置的序列化成果, Ajax结合

推荐文章

热门文章

标签

友情链接

关于本站

联系我们

特别鸣谢