如何从函数中禁用jQuery对话框中的按钮?

我有一个jQuery对话框，要求用户输入某些信息。在这个表单中，我有一个“continue”按钮。我想这个“继续”按钮只被启用一旦所有的领域有内容在他们，否则它将保持禁用。

我写了一个函数，每当字段状态发生变化时就调用它。但是，我不知道如何从这个功能启用和禁用对话框按钮。我该怎么办?

哎呀，我忘了说这些按钮是这样创建的:

$(function() {
  $("#dialog").dialog({
    bgiframe: true,
    height: 'auto',
    width: 700,
    show: 'clip',
    hide: 'clip',
    modal: true,
    buttons: {
      'Add to request list': function() {
        $(this).dialog('close');
        $('form').submit();
      },
      'Cancel': function() {
        $(this).dialog('close');
      }
    }
  })
});

当前回答

您需要设置disabled属性

 $('#continueButton').attr("disabled", true);

更新:啊哈，我现在看到复杂性了。jQuery对话框中有一行是有用的(在“按钮”部分下)。

 var buttons = $('.selector').dialog('option', 'buttons');

您需要从对话框中获取按钮集合，循环查找您需要的按钮，然后设置如上所示的disabled属性。

2009-02-23 13:04:06

其他回答

jQuery解决方案为我工作。

$('.ui-button').addClass("ui-state-disabled");$('.ui-button').attr("aria-disabled",'true');$('.ui-button').prop('disabled', true);

2018-08-17 23:44:40

要禁用对话框中的保存按钮，请使用函数中的以下行。

$(".ui-dialog-buttonpane button:contains('Save')").attr("disabled", true).addClass("ui-state-disabled");

要更改按钮中的文本，请使用以下行(将取消按钮的文本更改为关闭我)

 $(".ui-dialog-buttonpane button:contains('Cancel') span").text("Close Me");

2011-06-29 09:55:11

郑重声明，这篇文章帮我解决了我的问题。简而言之，你必须将disabled属性设置为disabled，而不是false:

_send_button.attr('disabled','disabled');

这是所有代码的外观，我还添加了一些样式，使它看起来是禁用的:

var _send_button = $('.ui-dialog-buttonpane button:contains(Send)');
var original_text = _send_button.text();
_send_button.text('Please wait...');
_send_button.addClass('ui-state-disabled');
_send_button.attr('disabled','disabled');
_send_button.fadeTo(500,0.2);

2009-09-26 11:06:38

从可用性的角度来看，如果有人试图提交一个不完整的表单，最好保持按钮启用，但显示错误消息。当我想要点击的按钮被禁用时，我简直要发疯了，而且我也不知道为什么。

2009-09-08 10:31:40

我认为这对所有人都有效，

<script type="text/javascript">
    $(document).ready(function() {
        $('#dialog').dialog('open');
        $(function(){
            $('#dialog').dialog({
                autoOpen: true,
                width: 400,
                modal: true,
                overlay: {
                    opacity: 0.8,
                    background: "black"
                },
                resizable: false,
                show: 'slow',
                buttons: {
                    //"OK":function() {
                    //    window.location="index.php?view=list";
                    //},
                    "Cancel": function() {
                        $(this).dialog("close");
                        $(this).attr("class", "button");
                    }
                }
            });

            var dlgFirstButton = $('.ui-dialog-buttonpane').find('button:first');
            dlgFirstButton.addClass('button');
        });
    });
</script>

2010-06-17 18:18:21

如何从函数中禁用jQuery对话框中的按钮?

推荐文章

最新文章

标签