【django】input type= button和 submit

最新推荐文章于 2024-04-26 22:44:17 发布
原创 最新推荐文章于 2024-04-26 22:44:17 发布 · 2.1k 阅读 · 2 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文详细介绍了HTML中的两种按钮类型：普通按钮(input type=button)和提交按钮(input type=submit)。普通按钮默认不会触发任何操作，除非通过JavaScript进行编程。而提交按钮则会在用户点击后自动提交表单，除非有特定的JavaScript阻止这一行为。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

  • <input type="button" /> 这就是一个按钮。如果你不写javascript 的话，按下去什么也不会发生。
  • <input type="submit" /> 这样的按钮用户点击之后会自动提交 form，除非你写了javascript 阻止它。
表单提交中的input、button、submit的区别
weixin_30376163的博客
12-29 2533
　　最近项目中用了很多的表单提交，发现input、button、submit甚至回车键都可以引发表单提交，下面将分别验证他们在使用中的区别。 1.input[type=submit] 我们直接来看例子： 代码如下： <form> <input name="name"> <input type="submit" value=...
【django】input type=submit type=button的区别
qq1518572311的博客
12-26 892
&lt;input&gt;的类型设置为type=submit，直接提交到url中 这种方式简单，但存在瑕疵。   &lt;input&gt;的类型设置为type=button， 鼓励用Ajax方式   &lt;input type="text" id="id_tag"&gt; 鼓励用Ajax方式...
request获取int类型的值_django获取前端button事件
weixin_39572794的博客
11-28 455
<form action="" method="post"> {% csrf_token %} <input type="hidden" name="shoucang" value=1> <button name="shoucang1">shoucang<button> </form>思路是将前端form表单第一个input框隐藏，填入...
html input type="submit",<input type="submit">
weixin_34711263的博客
07-31 470
elements of type submit are rendered as buttons. When the click event occurs (typically because the user clicked the button), the user agent attempts to submit the form to the server.A DOMString used...
form表单提交“input type=submit”
qdfgvbm_1的博客
11-10 418
form表单提交 使用一直提交没反应，试了很多次，查了很多资料，都没有用，最后发现居然是因为设置了disabled属性，导致了提交没有反应，记下来以便以后查看。
</script> <script type="text/template" id="DetailListTemplate"> <div id="detail_list" class="common" > <form> <span style="display:none" name="submittype"></span> <table cellspacing="4" style="padding: 0; table-layout: fixed;" class="inputs searchinput"> <colgroup> <col width="70px" /> <col width="220px" /> <col width="60px" /> <col width="200px" /> <col width="150px" /> <col /> </colgroup> <tbody> <tr><td class="tr">培训名称：</td><td id="peixunmc"></td> <td>课程名称：</td><td id="coursemc"></td> <td>提交方式：<span id="submittype"></span></td><td ></td> </tr> <tr> <td class="tr">姓      名： </td> <td> <input type="text" maxlength="20" name="txtName2" id="txtKeyword" placeholder="姓名/账号" class="txt im" /> </td> <td>部      门： </td> <td> <input type="text" maxlength="20" id="departmentid2" name="DepartmentID" class="txt" /> </td> <td> <label><input type="checkbox" checked="checked" id="hasChildren" title="是否包含子部门" />是否包含子部门</label> </td> <td> <input type="button" value=" 搜索 " id="searchName2" class="bbtn bg-blue" /> <input type="reset" value=" 重置 " class="bbtn bg-hui" /> <input type="button" value="下载作业" id="downloadHomework" style="display:none" class="bbtn bg-blue" /> </td> </tr> </tbody> </table> <
04-04
<button type="submit">提交表单</button> ``` (包含协议选择字段的定义参考了前端组件的实现方式[^2]) #### 2. CSS布局样式示例 ```css form { max-width: 600px; margin: 20px auto; padding: 20px; ...
<input type="hidden" name="next" value="{% url 'learning_logs:index' %}" />
07-27
<button type="submit">提交</button> ``` ### 关键说明 1. **隐藏字段作用** - 存储用户不可见但需要随表单提交的数据（如操作类型、重定向 URL） - 通过 `name` 属性在视图层用 `request.POST.get('name')` ...
如何将上述功能与数据库建立连接，将用户名密码保存在数据库中，并且能用<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>重置密码</title> <link rel="stylesheet" href="./password-reset.css"> <script defer src="./password-reset.js"></script> </head> <body> <div class="container"> <h1>重置密码</h1> <form id="reset-form"> <label for="old-password">旧密码:</label><br/> <input type="password" id="old-password" name="old-password" required/><br/> <label for="new-password">新密码:</label><br/> <input type="password" id="new-password" name="new-password" required/><br/> <label for="confirm-password">确认密码:</label><br/> <input type="password" id="confirm-password" name="confirm-password" required/><br/> <div style="margin-top:20px;"> <button type="submit" disabled id="btn-confirm">确认</button> <button type="button" id="cancelButton">取消</button> </div> </form> </div> </body> </html>该页面对用户密码进行修改
03-19
form.querySelectorAll('input[type="password"]').forEach(input => { input.addEventListener('input', () => { confirmBtn.disabled = !(form.checkValidity()); // 根据验证状态禁用按钮 }); }); }); ``` ...
解决Django提交表单报错:CSRF token missing or incorrect的问题
12-20
这个令牌随后会被用于所有POST请求的表单中，作为隐藏字段`<input type="hidden" name="csrfmiddlewaretoken">`。当用户提交表单时，Django会检查表单中提供的CSRF令牌是否与Cookie中的令牌匹配，如果匹配，则认为...
<body> <div class="container"> <div class="login-box"> <h2 style="text-align:center;">登录</h2> <form method="POST" action="/register_update.html"> <div class="input-group"> <label for="username">用户名:</label> <label> <input type="text" name="username" placeholder="请输入用户名"> </label> </div> <div class="input-group"> <label for="password">密 码:</label> <label> <input type="password" name="password" placeholder="请输入密码"> </label> </div> <label> <input type="submit" name="登录" style="padding:10px;width:100%;background-color:#007BFF;color:white;border:none;border-radius:4px;"> </label> </form> </div> </div> </body> 为什么这样写我点击提交按钮显示找不到url
05-24
<button type="submit">Submit</button> ``` 上述代码中 `/submit-form` 是目标地址，需确认服务器端已定义该路由处理逻辑。 #### 2. **服务器端路由未正确定义** 即使前端指定了正确的 `action` 路径，但...
gin-vue-blog自建博客
2401_84435700的博客
04-26 495
front 后期我会用flutter重写运行&&部署[server]AppMode = debug # debug 开发模式，release 生产模式HttpPort = :3000 # 项目端口JwtKey = 89js82js72 #JWT密钥，随机字符串即可[database]Db = mysql #数据库类型，不能变更为其他形式DbHost = 127.0.0.1 # 数据库地址DbPort = 3306 # 数据库端口DbUser = ginblog # 数据库用户名。
Django网络应用实践（3）-button按钮点击事件+超链接跳转及分页+路由管理
fuyouliyang的博客
04-10 5131
js的代码中，需要明确的是点击该按钮后所调用的路由，此时的路由不是一个具体的页面，而是在后台中具体处理某一事件的一个自定义函数。想要实现点击button按钮后触发某个事件，这就得使用js的知识，将按钮与具体的某个事件绑定，当点击该按钮时触发这一事件。与button跳转一样，这里跳转的还是一个执行某个功能的一个自定义函数，这个函数会负责将静态页面渲染出来。html的代码中，需要对button中id的参数进行明确，id明确之后才能绑定事件。我的二级路由写在app目录中的urls.py中，这个文件需要自己创建。
Django点击交互操作
AI悦创·编程私教1v1
03-05 3196
需求介绍 数据库内容读取并展示到首页上，首页展示了非常多的文章的标题和摘要，如果要查看内容的话，还得点击文章的查看，进到 article.html 中才可以看到。 那点击操作，如何实现？本节课我们来实现这个功能。 链接的渲染 首先是点击，那个查看按钮，是个 a 标签，点击触发的 href 属性，也就是访问新的链接。 访问新的链接，链接中必须携带当前文章的信息，方便在视图函数层面，查询到具体的文章信息，并渲染到 article.html 中。 传输的信息必须独一无二，不然就会出现。数据库中，每条数据都会自动
AmazeUI 按钮
一直专注于互联网
02-16 1783
&lt;!doctype html&gt; &lt;html class="no-js"&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt; &lt;meta name=&
网站开发进阶(四十四)input type=“submit“ 和“button“的区别
热门推荐
IT全栈 华强工作室
12-27 4万+
网站开发进阶(四十四)input type=”submit” 和”button”的区别  在一个页面上画一个按钮，有四种办法： 这就是一个按钮。如果你不写javascript 的话，按下去什么也不会发生。 这样的按钮用户点击之后会自动提交 form，除非你写了javascript 阻止它。 这个按钮放在 form 中也会点击自动提交，比前两个的优点是按钮的内容不光可以有文字，还可以有图片等多
在 input type="submit" 按钮中添加事件
HappierRaining
10-24 2万+
如下代码，可以直接在&lt;input type="submit" ..&gt;中添加onclick事件。用户点击"submit"按钮后会触发两个操作：一是提交表单到后台服务器。二是触发onClick事件调用我自己定义的upLoadData()函数。 ​ &lt;form action="http://127.0.0.1:5000" method="post" &gt;
前端 -- 基础 表单标签 - input type属性（按钮篇- submit,reset,button,file）
三毛与海子的博客
04-03 1757
Submit reset button file
Django--10 列表按钮点击弹出模态框Modal
liuning2008的专栏
02-17 3440
1 功能展示 点击按钮“处理”，弹出确认框 点击按钮“确定”，弹出modal框 点击按钮“确定”，发送ajax请求 后台接收到ajax请求，将接收到的数据打印 2 模态对话框html页面 <!-- Modal --> <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class
Django中button的处理 & ajax提交数据时不走Form组件验证
Quincy.Coder的博客
11-18 3013
button分类： type=’submit’ 默认类型，会默认提交表单~ type=’button’ type=’reset’ 项目中出现的问题: ajax提交数据时不走Form组件验证 处理方式: 指定input的类型type=’button’ 指定button的类型type=’button’ 上述两种处理方式效果一致！！！
django input
最新发布
07-27
<button type="submit">提交</button> ``` 如引用[^2]所示，每个表单字段渲染为`BoundField`对象，生成带有当前值的HTML输入元素。 #### 4. 数据验证流程 Django表单验证分为多个步骤： 1. **字段级验证**：每个...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值