![](/img/trans.png)
[英]Disabling the register button with on button click or on form submit , both ways stop the form from being submitted
[英]Disabling a submit button when clicking on it , will prevent the form from being submitted on Google Chrome
我在我的asp.net mvc里面的布局视图中添加了以下脚本: -
$(document).ready(function () {
$('.btn.btn-primary').click(function () {
$(this).prop("disabled", true);
if (!$('form').valid()) {
$(this).prop("disabled", false);
return false;
}
});
$('form').change(function () {
$('.btn.btn-primary').prop("disabled", false);
});
我的脚本的目的是禁用提交按钮,如果模型无效或用户更改表单值,则重新启用它们。 上述脚本在IE和Firefox上运行良好,但在Chrome上我无法提交表单,因为当用户点击提交按钮时,该按钮将被禁用,但表单将不会被提交。 知道如何在Chrome上解决这个问题吗?
而是在按钮的单击事件中禁用按钮 - 在表单的提交事件中禁用它(您也可以在那里检查表单的有效性)。
这样它将在所有浏览器中普遍使用。
<form action="http://www.microsoft.com">
<input class="btn-primary" type="submit" value="submit"/>
</form>
$('form').submit(function() {
$('input.btn-primary').prop("disabled", "disabled");
})
我刚刚遇到了同样的问题,当按钮被jQuery 禁用时, 谷歌浏览器没有激活我的提交事件。
背景信息:我有一个带有按钮的表单,只要单击该按钮就会被禁用。 因此PHP提交代码不会被多次调用。 该提交正在Drupal Backend上运行,在我的例子中是一个自定义的submit_hook 。 但肯定在任何其他CMS工作。 但那不是问题。 真正的问题是,Javascript代码正在禁用该按钮,谷歌浏览器认为按钮已完全死亡,而不仅仅是禁用。 所以它不再激发任何代码。
但是这个问题很容易解决。
所以这段代码适用于Firefox / IE :
(function($) {
Drupal.behaviors.somebehaviour = {
attach: function(context, settings) {
$('#edit-submit').click(function (e) {
$('#edit-submit').val('Is saved...');
$('#edit-submit').prop('disabled', 'disabled');
});
}
};
})(jQuery);
并且还要在Chrome上运行它,您需要添加以下行:
$(this).parents('form').submit();
所以对于这个例子,它最终将是:
(function($) {
Drupal.behaviors.somebehaviour = {
attach: function(context, settings) {
$('#edit-submit').click(function (e) {
$('#edit-submit').val('Is saved...');
$('#edit-submit').prop('disabled', 'disabled');
$(this).parents('form').submit();
});
}
};
})(jQuery);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.