单击时禁用提交按钮,将阻止在Google Chrome上提交表单。

2021/01/22 14:11 · jquery ·  · 0评论

我在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上解决此问题吗?

而是在按钮的click事件中禁用按钮-在表单的Submit事件中禁用它(您也可以在此处检查表单的有效性)。

这样,它将在所有浏览器中通用。

<form action="http://www.microsoft.com">
  <input class="btn-primary" type="submit" value="submit"/>
</form>


$('form').submit(function() {
  $('input.btn-primary').prop("disabled", "disabled");
})

我有同样的问题是,谷歌浏览器不fireing我提交事件时,按键得到了禁用通过jQuery的

背景信息:我有一个带有按钮的表格,单击该按钮时将其禁用。因此,PHP提交代码不会被多次调用。该提交在Drupal后端上运行,在我的情况下为自定义的commit_hook但可以肯定的是,可以在其他任何CMS中使用。但这不是问题。真正的问题是Javascript代码正在禁用该按钮,而Google Chrome浏览器认为该按钮已完全失效,而不仅仅是被禁用。因此,它不再触发任何代码。

但是这个问题很容易解决。

因此,这段代码可在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);
本文地址:http://jquery.askforanswer.com/danjishijinyongtijiaoanniujiangzuzhizaigoogle-chromeshangtijiaobiaodan.html
文章标签: ,   ,   ,   ,  
版权声明:本文为原创文章,版权归 admin 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!