jQuery UI 禁用整个页面上的所有提交按钮

Posted

技术标签:

【中文标题】jQuery UI 禁用整个页面上的所有提交按钮【英文标题】:jQuery UI Disable All Submit Buttons on Entire Page 【发布时间】:2013-03-31 06:04:40 【问题描述】:

提前感谢您的帮助。

请注意我正在使用 jQuery UI 来创建/样式按钮。

当用户单击提交按钮时,我想使用 jQuery 禁用所有表单上的所有提交按钮,在整个页面上。

这是我到目前为止所拥有的,目前它只禁用被点击的按钮,当我希望它禁用页面上的所有提交按钮时。

对于 jQuery UI:

<script>
$(function() 
$( ".button" )
.button()
);
</script>

禁用按钮:

 <script>
$(function() 
$('.button').button().click(function() 
    $(this).button('disable');
    $(this).closest('form').submit();
    return false;
);
$('input:submit').button('enable');
);
</script>

提交按钮/表单如下所示:

<form enctype="multipart/form-data" action="characters.php" method="post">
<input id="c_xp" class="text" type="text" value="150001" name="c_xp">
<input id="go" class="button ui-button ui-widget ui-state-default ui-corner-all" type="submit" value="Go" role="button" aria-disabled="false">
</form>

【问题讨论】:

您想在点击时禁用它们还是什么?他们都应该被禁用? 他们应该在提交时被禁用 看看我提供的小提琴 【参考方案1】:

这样做:

<script>
$(function() 
    $('.button').click(function() 
       $("input[type='submit']).button('disable');
       $(this).closest('form').submit();
       return false;
    );
$('input:submit').button('enable');
);
</script>

你可以做任何语句。

$("input[type='submit']").button('disable');
OR 
$("input[type='submit']").attr('disabled','disabled');

【讨论】:

这不起作用,使用此代码即使单击的按钮也不会禁用。 禁用你可以做的点击按钮.. $(this).button('disable');但你提到你想禁用所有按钮。 这可能很明显,但就我而言,我必须使用按钮[type="submit"]。更多信息在这里:api.jquery.com/submit-selector【参考方案2】:

这是一个禁用所有按钮的函数。

function disableButtons() 
    $('input[type=button], input[type=submit]').attr('disabled', 'disabled')

【讨论】:

【参考方案3】:

您的代码应如下所示:

<script>
$(function() 
$('.button').button()(function() 
    $('input[type=button], input[type=submit]').attr('disabled', 'disabled')
    $(this).closest('form').submit();
    return false;
);
);
</script>

【讨论】:

这不起作用,使用此代码即使单击的按钮也不会禁用。【参考方案4】:

此代码将使所有具有.button 类的按钮禁用

$( ".button" ).click(function() 
  $( ".button" ).button( disabled: true );
);

这是fiddle

【讨论】:

【参考方案5】:

我找到了解决方案,将我们的禁用代码更改为:

<script>
$(function() 
$('.button').button().click(function() 
    $('.button').button('disable');
    $(this).closest('form').submit();
    return false;
);
$('input:submit').button('enable');
);
</script>

成功了。

【讨论】:

【参考方案6】:

这样的……

$('form').submit(function () 
    $(':submit').attr('disabled', 'disabled');
);

【讨论】:

以上是关于jQuery UI 禁用整个页面上的所有提交按钮的主要内容,如果未能解决你的问题,请参考以下文章

禁用引导验证器提交按钮,直到整个表单有效

识别禁用的 UIButton 上的单击或手势事件

jquery:重置后禁用/启用按钮不起作用

禁用提交表单上的按钮

按下回车键,PrimeFaces禁用提交

JavaScript 按钮停止页面上的所有音频