Django开发踩坑(一)
autoescape
控制当前的自动转义行为。该标签以 on
或 off
作为参数,决定块内是否有自动转义行为。此区块以 endautoescape
结束标签关闭。
示例:
{% autoescape on %}
{{ body }}
{% endautoescape %}
Django中自定义tag的使用
在 Django 中,你可以通过创建一个自定义的模板标签来实现 get_direction
。以下是创建自定义模板标签的步骤:
- 在你的 Django 应用目录下创建一个名为
templatetags
的目录。 - 在
templatetags
目录下创建一个 Python 文件,例如my_tags.py
。 - 在
my_tags.py
文件中,你需要导入django.template
,然后创建一个继承自django.template.Library
的实例。 - 在这个实例上,你可以使用
@register.simple_tag
装饰器来定义你的自定义模板标签。
以下是一个简单的示例,定义了一个 get_direction
标签,它返回一个字符串 "north":
from django import template
register = template.Library()
@register.simple_tag
def get_direction():
return "north"
然后在你的模板中,你需要加载你的自定义模板标签,然后就可以使用它了:
{% load my_tags %}
{% get_direction as direction %}
这样,direction
变量就会被赋值为 "north"。你可以根据你的需求修改 get_direction
函数的实现。
请求的方法判断
在 Django 中,你可以通过检查 request.method
来判断请求的方法是 GET 还是 POST。request.method
是一个字符串,它表示请求的 HTTP 方法。如果请求的方法是 GET,request.method
的值将是 'GET';如果请求的方法是 POST,request.method
的值将是 'POST'。
def someView(request):
if request.method == 'POST':
print('post')
return HttpResponse('post')
else: # 处理 GET 请求
print('get')
return HttpResponse('get')
Get 方法的参数获取
在 Django 中,你可以通过 request.GET
或 request.POST
来获取请求的参数。这两个属性都是 QueryDict 对象,它们提供了一种方便的方式来访问所有的 HTTP 参数。
如果你想获取 GET 请求的参数,你可以使用 request.GET
。例如,如果你的 URL 是 /myview/?param=value
,你可以这样获取 param
参数的值:
def my_view(request):
param_value = request.GET.get
图片加载
在 Django 模板中,你可以使用双大括号 {{ }}
来插入变量。在你的例子中,如果你想使用一个变量作为 img
元素的 src
属性,你可以这样做:
<img src="{{ item.avator }}" class="img-fluid border-radius-md" />
在这个例子中,item.avator
是一个变量,它的值应该是一个图片的 URL。这个变量的值将被插入到 src
属性中。
请注意,这个变量需要在你的视图函数中被传递到模板。例如,如果你的视图函数是这样的:
def my_view(request):
discussion = [
{'avator': '/static/images/avator1.jpg'},
{'avator': '/static/images/avator2.jpg'},
# ...
]
return render(request, 'my_template.html', {'discussion': discussion})
那么在模板中,item.avator
将会是每个字典中 'avator' 键对应的值。
{% url %} 使用
{% url %}
是 Django 模板语言中的一个标签,它的作用是生成一个 URL。这个标签接受一个视图函数的名称作为参数,并返回对应的 URL。
在你的例子中,{% url 'community:discussion-create' %}
将会生成一个指向 discussion-create
视图函数的 URL。这个视图函数应该在你的 community
应用的 urls.py
文件中定义。
这个标签非常有用,因为它允许你在模板中生成动态的 URL。如果你在 urls.py
文件中更改了 URL 的模式,你不需要在模板中更改 URL,因为 {% url %}
标签会自动生成正确的 URL。
你可以在模板中的任何地方使用 {% url %}
标签,例如在链接的 href
属性中:
<a href="{% url 'community:discussion-create' %}">创建讨论</a>
在这个例子中,点击链接将会导航到 discussion-create
视图函数对应的页面。
aria-controls 和 aria-selected 属性的作用
aria-controls
和 aria-selected
是 ARIA(Accessible Rich Internet Applications)规范中定义的属性,用于提高网页的可访问性。
-
aria-controls
:此属性用于建立控制元素(如按钮或链接)与被控制元素之间的关系。被控制元素的 ID 应该作为aria-controls
属性的值。例如,如果一个按钮用于打开一个对话框,那么这个按钮的aria-controls
属性应该设置为对话框的 ID。 -
aria-selected
:此属性用于表示一个元素是否被选中。这对于可选的元素(如选项卡、列表项等)非常有用。aria-selected
的值可以是 'true' 或 'false'。如果元素被选中,aria-selected
的值应该是 'true';否则,应该是 'false'。
在你的代码中,aria-controls
和 aria-selected
属性用于创建选项卡式的导航菜单。每个选项卡链接到一个特定的元素(由 aria-controls
指定),并通过 aria-selected
属性表示它是否被选中。这样,屏幕阅读器用户可以更容易地理解和操作你的网页。
选项卡
使用了 Bootstrap 的 Tab 组件来创建一个选项卡式的导航菜单。每个 <a>
标签都有一个 href
属性,该属性的值以 #
开头,表示它是一个内部链接,链接到页面上的一个元素。这个元素的 ID 应该与 href
属性的值(去掉 #
)相同。
要控制每个选项卡显示的内容,你需要在页面上创建对应的元素,并设置它们的 ID 与选项卡的 href
属性相匹配。这些元素通常是 <div>
元素,它们包含了每个选项卡的内容。
<ul class="nav nav-pills nav-fill p-1" role="tablist">
<li class="nav-item">
<a class="nav-link mb-0 px-0 py-1 active" data-bs-toggle="tab" href="#hot-tabs-simple" role="tab" aria-controls="hot" aria-selected="true">最热讨论</a>
</li>
<li class="nav-item">
<a class="nav-link mb-0 px-0 py-1" data-bs-toggle="tab" href="#new-tabs-simple" role="tab" aria-controls="new" aria-selected="true">最新发布</a>
</li>
<li class="nav-item">
<a class="nav-link mb-0 px-0 py-1" data-bs-toggle="tab" href="#agg-tabs-simple" role="tab" aria-controls="agg" aria-selected="true">最高点赞</a>
</li>
</ul>
将所有的选项卡内容都放在一个父元素中,并为每个选项卡内容设置 class="tab-pane fade"
。然后,你可以使用 Bootstrap 的 JavaScript 插件来自动切换选项卡内容的显示和隐藏。
下面是一个例子:
<div class="tab-content">
<div id="agg-tabs-simple" class="tab-pane fade show active">
<!-- 这里是 "最高点赞" 选项卡的内容 -->
</div>
<div id="hot-tabs-simple" class="tab-pane fade">
<!-- 这里是 "My Profile" 选项卡的内容 -->
</div>
<!-- 其他选项卡内容 -->
</div>
在这个例子中,所有的选项卡内容都放在一个 class="tab-content"
的 <div>
元素中。每个选项卡内容都是一个 class="tab-pane fade"
的 <div>
元素,它的 ID 与对应的选项卡的 href
属性相匹配。
当用户点击一个选项卡时,Bootstrap 的 JavaScript 插件会自动显示与该选项卡 href
属性相匹配的元素,并隐藏其他元素。这样,所有的选项卡内容都会占用同一个位置,每次只显示一个。
Bootstrap 元素居右
要将元素靠右,你可以使用 Bootstrap 的内置工具类 text-end
。这个类会将文本对齐设置为右对齐。你可以将这个类添加到你想要靠右的元素的 class
属性中。
在你的代码中,如果你想将 author
div 元素靠右,你可以这样做:
<div class="author align-items-center text-end">
这样,author
div 中的内容就会靠右显示了。
如果你只想将 name
div 元素靠右,你可以这样做:
<div class="name ps-3 text-end">
可以使用 Bootstrap 的 d-flex
和 justify-content-end
类。d-flex
类会将元素设置为 flex 容器,而 justify-content-end
类会将 flex 容器的内容对齐到右边。
你可以将这两个类添加到 "author" div 的 class
属性中,如下所示:
<div class="author align-items-center d-flex justify-content-end">
这样,"author" div 中的内容就会靠右显示了。
<div class="author align-items-center d-flex justify-content-end" style="margin-top: 10px;">
<img src="{{ user_avatar }}" alt="..." class="avatar shadow" />
<div class="name ps-3">
<span>{{ user_name }}</span>
<div class="stats">
<small>Posted on {{ post_time }}</small>
</div>
</div>
</div>
button跳转时传参
在 Django 中,你可以使用 <a>
标签和 Bootstrap 的 btn
类来创建一个看起来像按钮的链接。然后,你可以使用 Django 的 {% url %}
模板标签来生成链接的 URL,并在其中使用表达式来计算参数。
例如,假设你有一个名为 post 的视图,它接受一个名为
post_id的参数。你可以创建一个按钮,当点击时,会跳转到
post_id参数加一的
post` 视图:
<a href="{% url 'post post_id|add:"1" %}" class="btn btn-primary">Next Post</a>
在这个例子中,post_id|add:"1"
是一个 Django 模板表达式,它会将 post_id
的值加一。{% url 'post-details' post_id|add:"1" %}
会生成一个 URL,这个 URL 是 post-details
视图,参数是 post_id
加一的值。
请注意,你需要在你的视图和 URL 配置中正确处理这个参数。如果 post_id
加一的值不存在,你的视图应该返回一个适当的错误响应(如 404 错误)。
对于 <button>
标签,你不能直接设置 href
属性来实现跳转,因为 <button>
标签本身不支持 href
属性。但你可以使用 JavaScript 来实现点击按钮时的跳转。
在 Django 中,你可以在按钮的 onclick
属性中使用 JavaScript 的 window.location.href
来设置新的 URL。你可以使用 Django 的 {% url %}
模板标签来生成这个 URL,并在其中使用表达式来计算参数。
例如,假设你有一个名为 post-details
的视图,它接受一个名为 post_id
的参数。你可以创建一个按钮,当点击时,会跳转到 post_id
参数加一的 post-details
视图:
<button class="btn btn-primary" onclick="window.location.href='{% url 'post-details' post_id|add:'1' %}'">Next Post</button>
在这个例子中,post_id|add:'1'
是一个 Django 模板表达式,它会将 post_id
的值加一。{% url 'post-details' post_id|add:'1' %}
会生成一个 URL,这个 URL 是 post-details
视图,参数是 post_id
加一的值。
当用户点击这个按钮时,浏览器会导航到这个新的 URL。
配置media路径,存储和读取 ImageField
或 FileField
使用media
在 Django 中,文件存储路径的开头是否有 /
取决于你想要如何组织你的文件。
如果路径以 /
开头,那么这个路径就是绝对路径。这意味着无论你当前在哪个目录下,这个路径都会从你的文件系统的根目录开始。例如,/static/images/covers/
就是一个绝对路径,它指向你的文件系统根目录下的 static/images/covers/
目录。
如果路径不以 /
开头,那么这个路径就是相对路径。这意味着这个路径会从你当前的目录开始。例如,static/images/covers/
就是一个相对路径,如果你当前在 /home/user/myproject/
目录下,那么这个路径就会指向 /home/user/myproject/static/images/covers/
目录。
在 Django 的 ImageField
或 FileField
中,upload_to
参数通常使用相对路径。这是因为 Django 会将这个路径与你在 settings.py
文件中设置的 MEDIA_ROOT
路径结合起来,来确定文件的最终存储位置。
例如,如果你的 MEDIA_ROOT
是 /home/user/myproject/media/
,并且你的 upload_to
是 static/images/covers/
,那么文件会被保存到 /home/user/myproject/media/static/images/covers/
目录下。
在 Django 中,你可以使用 MEDIA_URL
和 MEDIA_ROOT
设置来管理媒体文件。MEDIA_ROOT
是存储媒体文件的文件系统路径,而 MEDIA_URL
是这些文件的 URL 的前缀。
在你的 HTML 文件中,你可以使用 Django 的模板语言来访问这些文件。例如,如果你有一个 ImageField
或 FileField
,你可以使用 .url
属性来获取这个文件的 URL。
假设你的 MEDIA_URL
是 /media/
,你的 MEDIA_ROOT
是 /path/to/your/project/media/
,并且你有一个 Post
模型,这个模型有一个 cover
字段,这个字段是一个 ImageField
。
在你的视图函数中,你可以获取 Post
对象,然后将 post.cover.url
传递给你的模板:
def post_details(request, post_id):
post = get_object_or_404(Post, id=post_id)
context = {
'cover': post.cover.url,
}
return render(request, 'post-details.html', context)
然后,在你的模板中,你可以使用 {{ cover }}
来访问这个 URL:
<img src="{{ cover }}" alt="Cover image" />
这样,当 Django 渲染这个模板时,它会将 {{ cover }}
替换为 post.cover.url
的值,这个值是 /media/
加上 cover
文件的路径。例如,如果 cover
文件的路径是 static/images/covers/my_cover.jpg
,那么 post.cover.url
的值就会是 /media/static/images/covers/my_cover.jpg
。
请注意,为了让这个 URL 可以正确地指向 MEDIA_ROOT
下的文件,你需要在你的 urls.py
文件中添加一些配置。你可以使用 django.conf.urls.static.static
函数来自动地添加这些配置:
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [
# ... your other url patterns ...
]
if settings.DEBUG:
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
这样,当 DEBUG
是 True
时,Django 就会添加一个 URL 模式,这个模式将 MEDIA_URL
下的所有请求映射到 MEDIA_ROOT
目录。
redirect使用
在 Django 中,redirect
是一个非常有用的函数,它可以将用户重定向到一个新的 URL。当你在视图函数中返回一个 redirect
响应时,浏览器会收到一个 302 重定向响应,并被告知新的 URL。然后,浏览器会自动请求这个新的 URL。
如果你在 redirect
后刷新浏览器,浏览器会重新请求最后一个请求的 URL,也就是 redirect
指向的 URL。这是因为 redirect
实际上是通过发送一个特殊的 HTTP 响应来告诉浏览器去请求一个新的 URL。
这也是为什么在提交表单后通常会使用 redirect
:如果用户在提交表单后刷新浏览器,浏览器会重新提交表单,可能会导致数据被重复提交。但是,如果你在处理表单数据后返回一个 redirect
响应,那么用户刷新浏览器时,浏览器会请求 redirect
指向的 URL,而不是重新提交表单。
下面是一个例子:
from django.shortcuts import redirect
def create_post(request):
if request.method == 'POST':
form = PostForm(request.POST)
if form.is_valid():
post = form.save()
return redirect('post_details', post_id=post.id)
else:
form = PostForm()
return render(request, 'create_post.html', {'form': form})
在这个例子中,当用户提交表单时,我们会创建一个新的 Post
对象,并将用户重定向到这个 Post
的详情页面。如果用户在被重定向后刷新浏览器,浏览器会重新请求 Post
的详情页面,而不是重新提交表单。
通过ID获取dom
在 JavaScript 中,你可以使用 document.getElementById
函数来获取 ID 为 like
的元素。这个函数会返回一个表示这个元素的对象,你可以使用这个对象来读取或修改这个元素的属性。
在你的 HTML 中,你可以添加一个 <script>
标签来包含你的 JavaScript 代码。例如:
<script>
var likeElement = document.getElementById('like');
// 现在,likeElement 就是 ID 为 'like' 的元素
// 你可以使用 likeElement 来读取或修改这个元素的属性
// 例如,你可以使用 likeElement.textContent 来获取或设置这个元素的文本内容
</script>
请注意,你需要确保 document.getElementById
是在 DOM 完全加载后再调用的。如果你在 DOM 还没有完全加载时调用 document.getElementById
,那么这个函数可能会返回 null
,因为它还找不到 ID 为 like
的元素。你可以将你的 JavaScript 代码放在 <body>
标签的最后,或者使用 window.onload
事件来确保你的代码是在 DOM 完全加载后再执行的。
AutoField的递增逻辑
在 Django 中,AutoField
是一个整数字段,它会自动递增。每当你创建一个新的记录,AutoField
就会为这个记录分配一个新的、唯一的值。这个值是在数据库中所有的同一类型的 AutoField
值中最大的那个值加一。
AutoField
的自增条件是:
-
当你创建一个新的记录时,如果你没有为
AutoField
指定一个值,那么 Django 就会自动为这个字段分配一个新的值。 -
如果你为
AutoField
指定了一个值,那么 Django 就会使用你指定的这个值。但是,请注意,如果你指定的值已经被其他的记录使用了,那么 Django 就会抛出一个IntegrityError
异常。
在你的代码中,id
字段是一个 AutoField
。这意味着每当你创建一个新的 File
或 ChatMessage
记录时,Django 就会自动为 id
字段分配一个新的、唯一的值。
class File(models.Model):
id = models.AutoField(primary_key=True)
# ...
class ChatMessage(models.Model):
id = models.AutoField(primary_key=True)
# ...
请注意,如果你没有为模型指定一个主键,那么 Django 就会自动为你的模型添加一个名为 id
的 AutoField
。
View类视图中request的使用
在 Django 中,View
类的方法不需要直接传入 request
参数。当 Django 处理一个请求时,它会自动创建一个 request
对象,并将这个对象作为第一个参数传递给视图函数。在类视图中,这个 request
对象被保存在 self.request
属性中,所以你可以在任何方法中通过 self.request
来访问这个对象。
self
是 Python 类中的一个特殊参数,它代表类的实例。在类的方法中,你可以使用 self
来访问或修改这个实例的属性。
视图中request.user 的使用
在方法中,self.request.user.is_authenticated
是检查当前用户是否已经登录。如果用户已经登录,那么 self.request.user
就是一个表示当前用户的 User
实例,否则 self.request.user
是一个 AnonymousUser
实例。
作为查询的条件时,使用user的id属性进行查询ChatMessage.objects.filter(user=self.request.user.id).order_by('created_at')
是查询数据库,获取当前用户的所有聊天消息,并按照 created_at
字段的值进行排序。这个查询的结果是一个 QuerySet
,你可以将它看作是一个 ChatMessage
实例的列表。
View类视图中get post的参数
在 Django 的类视图(Class-Based View)中,get
方法是处理 GET 请求的方法。这个方法的第一个参数是 self
,它代表类的实例。第二个参数是 request
,它是一个 HttpRequest
对象,代表客户端发来的 HTTP 请求。
虽然 self
包含了 request
属性(即 self.request
),但是这个属性是在 Django 调用 get
方法之前设置的。在 get
方法被调用时,Django 会将 HttpRequest
对象作为第二个参数传递给 get
方法。这样,你就可以在 get
方法中直接访问 request
对象,而不需要通过 self.request
。
这是 Django 的设计决定,它使得你可以在类视图的任何方法中通过 self.request
访问 HttpRequest
对象,同时也可以在处理 HTTP 请求的方法(如 get
、post
等)中直接访问 request
对象。
jQuery中$的使用
在 jQuery 中,$('list')
会尝试选择一个名为 list` 的 HTML 标签。
如果你想要选择一个类名为 messages-list
的元素,你应该使用 .messages-list
作为选择器:
$('.messages-list')
如果你想要选择一个 id 为 messages-list
的元素,你应该使用 #messages-list
作为选择器:
$('#messages-list')
在这两个例子中,.
和 #
是 CSS 选择器的语法,.
用于选择类名,#
用于选择 id。jQuery 的选择器语法基于 CSS 的选择器语法。
load_dotenv()加载 .env 文件
load_dotenv()
默认不会覆盖已经存在的环境变量。如果你已经在环境中设置了一个变量,那么 .env 文件中的值不会被加载。你可以通过传递 override=True
给 load_dotenv()
来改变这个行为,例如 load_dotenv(override=True)
。
Django进行登陆的权限校验
在 Django 中,你可以使用 login_required
装饰器来实现这个功能。login_required
装饰器会检查用户是否已经登录,如果没有登录,它会重定向用户到登录页面。
首先,你需要在你的视图函数上添加 @login_required
装饰器:
from django.contrib.auth.decorators import login_required
@login_required
def your_view(request):
# ...
然后,你需要在你的 settings.py 文件中设置 LOGIN_URL
,这是当用户未登录并尝试访问需要登录的页面时,Django 会重定向用户到这个 URL:
LOGIN_URL = 'login'
在这个例子中,'login'
是登录视图的 URL 名称,你需要将它替换为实际的 URL 名称。
请注意,login_required
装饰器只能用于基于函数的视图。如果你使用基于类的视图,你应该使用 LoginRequiredMixin
:
from django.contrib.auth.mixins import LoginRequiredMixin
class YourView(LoginRequiredMixin, View):
# ...
在这个例子中,LoginRequiredMixin
应该在其他的 mixin 和 View
之前。
在基于view的类视图的post方法中校验登陆
Django 提供了一个 request.user.is_authenticated
属性,你可以使用它来检查用户是否已经登录。
如果用户没有登录,你可以使用 redirect
函数来重定向用户到登录页面。你需要在你的 post
方法中添加以下的代码:
from django.shortcuts import redirect
from django.urls import reverse
class smartAnalysis(View):
def post(self, request, *args, **kwargs):
if not request.user.is_authenticated:
return redirect(reverse('login')) # 'login' 是登录视图的 URL 名称
# ... 其他的代码 ...
在这个例子中,reverse('login')
会返回登录视图的 URL,你需要将 'login'
替换为实际的 URL 名称。
请注意,这种方法不会阻止未登录的用户访问其他的方法,例如 get
或 put
。如果你想要对所有的方法进行登录检查,你应该使用 LoginRequiredMixin
。
Django中model创建数组字段
在 Django 的模型中,你可以使用 ArrayField
来创建一个数组字段。ArrayField
是 PostgreSQL 数据库的一个特性,所以它只在使用 PostgreSQL 数据库时可用。
首先,你需要从 django.contrib.postgres.fields
导入 ArrayField
,然后你可以在你的模型中使用它。例如,如果你想要创建一个字符串数组,你可以这样做:
from django.contrib.postgres.fields import ArrayField
from django.db import models
class ChatRecord(models.Model):
id = models.AutoField(primary_key=True)
user = models.ForeignKey(User, on_delete=models.CASCADE)
topic = ArrayField(models.CharField(max_length=100), blank=True, default=list)
def __str__(self):
return f"{self.user.username}: {', '.join(self.topic)}"
在这个例子中,ArrayField(models.CharField(max_length=100), blank=True, default=list)
创建了一个可以存储字符串的数组。blank=True
表示这个字段可以为空,default=list
表示默认值是一个空列表。
请注意,如果你的数据库不是 PostgreSQL,你需要使用其他的方法来实现数组字段,例如使用 JSONField
或者创建一个多对多的关系。
Django ORM 中distinct方法
在 Django ORM 中,distinct()
方法用于从查询结果中删除重复的行。
例如,如果你有一个 Blog
模型,每个 Blog
对象有一个 author
字段,你可能想要获取所有的作者。你可以使用以下的代码:
authors = Blog.objects.values('author').distinct()
在这个例子中,values('author')
返回一个包含所有 author
字段值的字典,distinct()
确保每个作者只出现一次。
请注意,distinct()
方法在某些数据库上可能不支持,例如 MySQL。在这些数据库上,你需要使用其他的方法来删除重复的行,例如使用 group_by
。
另外,distinct()
方法只能用于查询集(QuerySet),不能用于模型的实例。如果你尝试在一个模型的实例上调用 distinct()
,你会得到一个 AttributeError
。
Django ORM 中values方法
在 Django ORM 中,values()
方法用于返回一个包含特定字段值的字典,而不是模型实例。
例如,如果你有一个 Blog
模型,每个 Blog
对象有一个 title
和 author
字段,你可以使用以下的代码来获取所有博客的标题和作者:
blogs = Blog.objects.values('title', 'author')
在这个例子中,blogs
是一个字典的列表,每个字典包含一个博客的标题和作者。例如:
[{'title': 'First Blog', 'author': 'John'}, {'title': 'Second Blog', 'author': 'Jane'}]
如果你不传递任何参数给 values()
,它会返回所有字段的值:
blogs = Blog.objects.values()
在这个例子中,blogs
是一个字典的列表,每个字典包含一个博客的所有字段。
values()
方法通常用于当你只需要一部分字段的值,而不需要整个模型实例时。它也可以用于聚合查询,例如计算每个作者的博客数量。
为Form重写提交事件
你可以通过添加一个 onsubmit
属性到 form
标签来添加一个提交函数。这个属性的值应该是你想要在表单提交时执行的 JavaScript 函数的名称。
首先,你需要在你的 HTML 文件中定义这个函数。你可以将它放在一个 <script>
标签中,例如:
<script>
function submitForm(event) {
event.preventDefault(); // 阻止表单的默认提交行为
var topic = document.getElementById('newtopic').value;
// 在这里添加你的代码,例如发送一个 AJAX 请求
}
</script>
然后,你可以将 onsubmit
属性添加到 form
标签:
<form role="form text-left" onsubmit="submitForm(event)">
在这个例子中,当用户提交表单时,浏览器会执行 submitForm
函数。event
参数是一个 Event
对象,包含了事件的信息。在 submitForm
函数中,你可以使用 event.preventDefault()
来阻止表单的默认提交行为,然后获取用户输入的主题,并执行你的代码。