首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

jquery bootstrapValidator :多个输入值的总和,如果不相等,则禁用提交按钮

jquery bootstrapValidator是一个基于jQuery和Bootstrap的表单验证插件。它可以用于验证表单中的各种输入字段,包括文本框、下拉框、复选框等。它的主要功能是在表单提交之前对输入值进行验证,以确保输入的数据符合预期的格式和要求。

对于多个输入值的总和是否相等的验证,可以通过自定义验证规则来实现。以下是一个示例代码:

代码语言:txt
复制
$('#myForm').bootstrapValidator({
    fields: {
        input1: {
            validators: {
                callback: {
                    message: '输入值总和不相等',
                    callback: function(value, validator, $field) {
                        var input1Value = parseInt(value);
                        var input2Value = parseInt($('#input2').val());
                        var input3Value = parseInt($('#input3').val());
                        var sum = input1Value + input2Value + input3Value;
                        return sum === input1Value; // 判断总和是否相等
                    }
                }
            }
        },
        input2: {
            // 省略其他验证规则
        },
        input3: {
            // 省略其他验证规则
        }
    }
});

在上述代码中,我们通过自定义的callback验证规则来判断输入值的总和是否相等。如果不相等,则禁用提交按钮,并显示错误提示信息。

推荐的腾讯云相关产品:腾讯云云服务器(CVM)、腾讯云数据库MySQL版、腾讯云对象存储(COS)。

以上是对jquery bootstrapValidator多个输入值总和不相等的验证的完善且全面的答案。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

bootstrapValidator 中文API

disableSubmitButtons disableSubmitButtons(disabled): BootstrapValidator - 禁用或启用提交按钮 参数 类型 描述 disabled...如果未设置,所有字段验证器将被启用或禁用 例 启用,禁用验证器 getDynamicOption getDynamicOption(field*, option*): String - 返回可以动态设置选项...参数 类型 描述 field 字符串| jQuery 字段名称或字段元素如果未定义字段,该方法将返回所有字段所有错误消息 validator 串 验证器名称如果未定义验证器,该方法返回所有验证器错误消息...option 串 选项名称如果未定义,该方法返回给定验证器选项 getSubmitButton getSubmitButton(): jQuery - 返回显示点击提交按钮jQuery元素。...null如果没有点击提交按钮返回。 已验证 isValid(): Boolean- true如果所有表单域都有效,返回。否则返回false。 调用这个之后,确保已经调用了validate方法。

13.1K50

jquery使按钮置灰不可用

"disableButton">禁用按钮jQuery代码实现按钮置灰不可用接下来,我们使用jQuery来实现按钮置灰不可用效果。...如果需要给按钮添加文本提示,可以使用attr("title", "按钮禁用")。...通过本文介绍,您可以简单地使用jQuery来实现按钮置灰不可用效果,提升用户体验并确保操作有效性。如果有任何疑问或者其他需求,欢迎留言讨论。希望本文对您有所帮助!...禁用提交按钮jQuery代码实现按钮置灰不可用接下来,我们使用jQuery来实现按钮置灰不可用效果...disabled是HTML中常用属性,用于禁用某些元素,例如按钮输入框等,使其变为不可用状态。当元素被禁用时,用户无法与该元素进行交互,无法点击按钮输入内容或选择选项等操作。1.

21510

python测试开发django-154.bootstrap-formvalidation

前言 表单输入框对输入内容校验,这是一个很基本功能,像这种非常普遍功能,当然是先找下有没有现成插件可以使用。...这里介绍一款很好用表单验证插件,formvalidation,实际上也是bootstrap一个插件,之前叫bootstrapValidator,现在独立出来了。...还有前面导入了jquery.min.js,还是要导入formvalidation里面的jquery.min.js,因为如果不导入,可能会导致remote类型验证失效。...点提交按钮会触发submit方法提交表单,我们也可以自定义ajax提交 //点提交时候校验 $('[type="submit"]').click(function(e) {...// Prevent form submission 阻止默认submit方法,用ajax提交 e.preventDefault(); var $form = $("#login-form

1.6K40

bootstrap框架基础知识点整理

----响应式开发 多个屏幕尺寸共同设置 方法1: 方法2 栅格系统列偏移 列表 内联列表 按钮 按钮尺寸设置 激活状态 button 元素 链接()元素 禁用状态 button 元素...链接()元素 导航条 反色导航条 轮播图 定时切换轮播图 注意: 多个轮播图必须修改轮播图ID 排版-对齐方式 表单元素 表单校验 分页条 分页条激活状态 禁用状态 ----...如果列元素占用列数,总和小于等于12,这些列元素还排列在一行上 如果列元素占用列数,总和大于等于12,大于12列元素会另起一行排列 栅格是可以进行无限嵌套: 行----列----行—列… 一行有十二列.../js/bootstrap.min.js"> ---- 方法2 如果设置了一个屏幕尺寸,比这个屏幕尺寸大屏幕,继承当前设置 比这个屏幕小尺寸,...通过为按钮背景设置 opacity 属性就可以呈现出无法点击效果。

3.8K40

一些好用jquery技巧

1、返回顶部按钮 通过使用jQueryanimate 和scrollTop 方法,不用插件就可以创建一个滚动到顶部简单动画: // Back to top $('.top').click(function...6、禁用输入字段 有时候,你可能想要禁用表格提交按钮或它某一项文字输入直到用户执行了特定操作(例如,勾选“我已阅读相关条款”复选框)。...添加 disabled属性到你输入就可以在你想要时候才启用它: $('input[type="submit"]').prop('disabled', true); 然后你只需要运行输入prop 方法就可以了...如果没有定义处理程序,其他jQuery代码或会就此罢工。...15、链式插件调用 jQuery允许“链式”插件方法调用,以减轻反复查询DOM并创建多个jQuery对象过程。

3.9K60

Ajax等待返回结果时,弹出一个友好等待提示

巧用AjaxbeforeSend 提高用户体验 jQuery是经常使用一个开源js框架,其中$.ajax请求中有一个beforeSend方法,用于在向服务器发送请求前执行一些动作。...,用户点击提交按钮误认为自己没有操作成功,进而会重复提交按钮操作次数,如果页面前端代码没有做一些相应处理,通常会导致多条同样数据插入数据库,导致脏数据增加。...要避免这种现象,在$.ajax请求中beforeSend方法中把提交按钮禁用掉,等到Ajax请求执行完毕,在恢复按钮可用状态。...: "application/json",       url: "/Home/Submit",       beforeSend: function () {           // 禁用按钮防止重复提交...如果需要,你可以在这里设置XHR对象。 ajaxSend 全局事件 请求开始前触发全局事件 success 局部事件 请求成功时触发。即服务器没有返回错误,返回数据也没有错误。

4.9K100

Ajax等待返回结果时,弹出一个友好等待提示

巧用AjaxbeforeSend 提高用户体验 jQuery是经常使用一个开源js框架,其中$.ajax请求中有一个beforeSend方法,用于在向服务器发送请求前执行一些动作。...,用户点击提交按钮误认为自己没有操作成功,进而会重复提交按钮操作次数,如果页面前端代码没有做一些相应处理,通常会导致多条同样数据插入数据库,导致脏数据增加。...要避免这种现象,在$.ajax请求中beforeSend方法中把提交按钮禁用掉,等到Ajax请求执行完毕,在恢复按钮可用状态。.../json",       url: "/Home/Submit",       beforeSend: function () {           // 禁用按钮防止重复提交           ...如果需要,你可以在这里设置XHR对象。 ajaxSend 全局事件 请求开始前触发全局事件 success 局部事件 请求成功时触发。

3.9K10

Java 后台开发面试题分享九

不可重复读:对于两个事务 T1 和 T2,T1 读取了一个字段,然后 T2 更新了该字段并提交之后,T1 再次提取同一个字段,便不相等了。....html() 方法使用在元素集合上时,只读取第一个元素;.val() 方法和 .html() 相同,如果其应用在元素集合上时,只能读取第一个表单元素 value ,但是 .text() 不一样,如果....html(htmlString),.text(textString) 和 .val(value) 三种方法都是用来替换选中元素内容,如果三个方法同时运用在多个元素上时,那么将会替换所有选中元素内容....html(),.text(),.val() 都可以使用回调函数返回来动态改变多个元素内容。...---- 处理通过 jQuery append 加入元素方法 通过 jQuery append 新添加进网页元素,使用 $(#id).click(function(){}) 是没有效果

72420

Bootstrap快速入门

为0;b是该css选择器上id数量总和,一般为1个;c是用在该css选择器上其他属性css选择器和伪类总和,包括class(.btn)和属性css选择器li[id=red];d计算元素div和伪元素...[att~=value] 该属性必须是多个空格隔开,比如class="title featured home",其中需要有value [att|=value] 属性时value或value-...()指定元素一个或多个特定子元素(可以是数字,也可以是even,odd)。...例如,设置按钮组,除第一个、最后一个按钮和带dropdown-toggle样式元素外,其他btn样式都不设置圆角 .btn-group > .btn:not(:first-child):not(:last-child...=function(e){} jQuery事件绑定:jQuery使用on和off来绑定和禁用时间,但bootstrap中稍有变化 $('td').on('click', function(event)

4.1K61

所有前端都必须知道 jQuery 技巧

禁用输入字段       有时候,你可能想要禁用表格提交按钮或它某一项文字输入直到用户执行了特定操作(例如,勾选 “我已阅读相关条款” 复选框)。...添加 disabled 属性到你输入就可以在你想要时候才启用它: $('input[type="submit"]').prop('disabled', true);  然后你只需要运行输入...prop 方法就可以了,不过 disabled 要设置为 false: $('input[type="submit"]').prop('disabled', false); 5....淡入 / 滑动切换   滑动和淡入都是我们用 jQuery 做动画时候大量运用东西。如果你只是想在用户点击之后展示一个元素的话,那么用 fadeIn 和 slideDown 方法就很完美。...如果没有定义处理程序,其他 jQuery 代码或会就此罢工。

2K70

所有前端都必须知道 jQuery 技巧

禁用输入字段       有时候,你可能想要禁用表格提交按钮或它某一项文字输入直到用户执行了特定操作(例如,勾选 “我已阅读相关条款” 复选框)。...添加 disabled 属性到你输入就可以在你想要时候才启用它: $('input[type="submit"]').prop('disabled', true);  然后你只需要运行输入 prop...方法就可以了,不过 disabled 要设置为 false: $('input[type="submit"]').prop('disabled', false); 5....淡入 / 滑动切换   滑动和淡入都是我们用 jQuery 做动画时候大量运用东西。如果你只是想在用户点击之后展示一个元素的话,那么用 fadeIn 和 slideDown 方法就很完美。...如果没有定义处理程序,其他 jQuery 代码或会就此罢工。

1.7K20

所有前端都必须知道 jQuery 技巧

禁用输入字段       有时候,你可能想要禁用表格提交按钮或它某一项文字输入直到用户执行了特定操作(例如,勾选 “我已阅读相关条款” 复选框)。...添加 disabled 属性到你输入就可以在你想要时候才启用它: $('input[type="submit"]').prop('disabled', true); 然后你只需要运行输入 prop...方法就可以了,不过 disabled 要设置为 false: $('input[type="submit"]').prop('disabled', false); 5....淡入 / 滑动切换 滑动和淡入都是我们用 jQuery 做动画时候大量运用东西。如果你只是想在用户点击之后展示一个元素的话,那么用 fadeIn 和 slideDown 方法就很完美。...如果没有定义处理程序,其他 jQuery 代码或会就此罢工。

2K100

表单

:此属性指示服务器上处理表单输出程序,一般来说,当用户单击表单上"提交"按钮后信息发送到Web服务器上,由attion属性所指程序处理如果action为空默认提交到本页     method:此属性告诉浏览器...例如如果表单上有几个文本框,可以按名称来标识它     value        此属性是可选属性他指定元素初始如果type为radio类型必须指定一个     size        此属性指定表单元素初始宽度...="email"/> url   用于输入URL地址这类特殊文本文本框提交表单时如果输入不是uil地址格式文本,将不允许提交表单 数字   number   用于提供数字文本框我们可以对数字进行控制包括最大,最小合法间隔或默认,如果输入数字不在限定范围之内,   则会出现错误提示。...max number 规定允许最大 step number 规定合法数字间隔(如step="2",合法数是-2 0、2、4等) 滑块 用于提供数字文本框我们可以对数字进行控制包括最大,最小合法间隔或默认

4.7K90

JQuery中Ajax功能使用技巧二

虽然数据能够读出来,但是还是有一些小BUG出现: 1、留言板计数器第一次打开时候已做更新,但是点击刷新按钮就无动于衷了。...2、点击 回复 链接弹出输入管理员回复框,在里面输入回复留言之后点击提交之后页面上不会显示新添加留言回复(实际上已经写入到数据库)。 3、显示回复内容有点问题。...(这里嵌套了一层AJAX操作) 第一个和第二个问题大概就是系统缓存问题了。在IE选项里面把缓存禁用之后就一切正常了,但客户客户端浏览器并不会如此设置,所以我们还必须在页面代码里面禁用缓存。...,返回是xmlhttprequest对象 但是为了能够让返回正确赋值,你必须把ajax设置为同步,而非异步。        ...代表浏览一次页面计数器加1         dataType: 'text', cache:false,   //在这里禁用缓存,每次页面dom加载完毕之后就会和服务器进行交互而不通过缓存

90230

前端开发者都应知道 jQuery 小技巧

回到顶部按钮 预加载图片 检查图片是否加载完毕 自动修复损坏图片 Hover 上 Class 开关 禁用 input 字段 停止链接加载 淡入淡出/滑动开关 简单折叠效果 将两个 Div 设为相同高度...在新窗口打开外部链接 找到文本元素 切换可视与隐藏触发器 Ajax 调用错误处理 链式操作 回到顶部按钮 通过使用 jQuery animate 和 scrollTop 方法...禁用 input 字段 有时你也许想让表单提交按钮或其文本输入框变得不可用,直到用户执行了一个特定行为(例如确认 “我已经阅读该条款” 复选框)。...; } }); Ajax 调用错误处理 当某次 Ajax 调用返回 404 或 500 错误,就会执行错误处理。但如果没有定义该处理,其他 jQuery 代码或许会停止工作。...支持链式调用插件,以减缓反复查询 DOM,并创建多个 jQuery 对象。

2.3K30

10个jQuery表单操作代码片段

代码片段1: 在表单中禁用“回车键” 大家可能在表单操作中需要防止用户意外提交表单,那么下面这段代码肯定非常有帮助: $("#form").keypress(function(e) {...and multiple select elements) else if (tag == 'select') this.selectedIndex = -1; }); }; 代码片段3: 将表单中按钮禁用...下面的代码对于ajax操作非常有用,你可以有效避免用户多次提交数据,个人也经常使用: 禁用按钮: $("#somebutton").attr("disabled", true); 启动按钮: $(..."#submit-button").removeAttr("disabled"); 代码片段4: 输入内容后启用递交按钮 这个代码和上面类似,都属于帮助用户控制表单递交按钮。...使用这段代码后,递交按钮只有在用户输入指定内容后才可以启动。 $('#username').keyup(function() { $('#submit').attr('disabled', !

90500

扫码

添加站长 进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

    运营活动

    活动名称
    广告关闭
    领券