一个Form表单多个Submit提交按钮!实现提交不同的参数!

给 submit 的按钮加onclick 方法来自定义预处理参数,比如
<script type="text/javascript">
function submitFun(act)
{
$('#action').val(act);
}
</script>

<form name="myForm">
<input type="hidden" name="action" value="">
<input type="submit" name="editBtn" value="修改" οnclick="submitFun('edit');">
<input type="submit" name="delBtn" value="删除" οnclick="submitFun('del');">
</form>

然后再服务端去判断action传过来的值进行操作!

转载于:https://www.cnblogs.com/kismet82/p/7553794.html

下面是一个监听多个按钮的layui form表单的demo: ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Layui Form监听多个按钮</title> <link rel="stylesheet" href="https://www.layuicdn.com/layui/css/layui.css"> </head> <body> <div class="layui-container"> <form class="layui-form"> <div class="layui-form-item"> <label class="layui-form-label">用户名</label> <div class="layui-input-block"> <input type="text" name="username" required lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">密码</label> <div class="layui-input-block"> <input type="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <div class="layui-input-block"> <button class="layui-btn" lay-submit lay-filter="login">登录</button> <button class="layui-btn layui-btn-primary" type="reset">重置</button> </div> </div> </form> </div> <script src="https://www.layuicdn.com/layui/layui.js"></script> <script> layui.use(['form', 'layer'], function(){ var form = layui.form; var layer = layui.layer; //监听表单提交 form.on('submit(login)', function(data){ //模拟登录请求 if(data.field.username === 'admin' && data.field.password === '123456'){ layer.msg('登录成功'); }else{ layer.msg('用户名或密码错误'); } return false; }); //监听表单重置 form.on('reset', function(){ //重置表单时清空验证信息 form.render(); }); }); </script> </body> </html> ``` 在这个demo中,我们使用了layui的form模块来实现表单的提交和重置操作。我们给登录按钮设置了`lay-filter`属性,值为`login`,这样就可以在表单提交时监听这个按钮的点击事件。同时,我们也监听了表单的重置事件。在表单提交时,我们可以通过`data.field`获取到表单中的所有数据,然后进行相应的处理。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值