我有一个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');
      }
    }
  })
});

当前回答

我得到这个工作与方法.dialog(“小部件”)返回对话框DIV本身。如果你在对话框方法中:

$(this)
.dialog("widget")
.find("button")
.addClass("ui-state-disabled") // for the style
.attr("disabled", true);

其他回答

我发现了一个禁用对话框按钮(或执行任何其他操作)的简单方法。

    var dialog_selector = "#myDialogId";

    $(dialog_selector).parent().find("button").each(function() {
        if( $(this).text() == 'Bin Comment' ) {
            $(this).attr('disabled', true);
        }
    });

您只需选择对话框的父节点并找到所有按钮。然后检查你的按钮的文本,你可以识别你的按钮。

在jQuery世界中,如果你想从一组DOM元素中选择一个对象,你应该使用eq()。

例子:

Var按钮= $('按钮').eq(1);

or

Var按钮= $('按钮:eq(1)');

下面是修改后的问题示例,一旦点击就会禁用按钮:

$(function() {
    $("#dialog").dialog({
        bgiframe: true,
        height: 'auto',
        width: 700,
        show: 'clip',
        hide: 'clip',
        modal: true,
        buttons: {
            'Add to request list': function(evt) {

                // get DOM element for button
                var buttonDomElement = evt.target;
                // Disable the button
                $(buttonDomElement).attr('disabled', true);

                $('form').submit();
            },
            'Cancel': function() {
                $(this).dialog('close');
            }
        }
    });
}

另外,下面的问题也会有帮助: 如何禁用jQuery UI对话框上的按钮?

您可以简单地将id添加到按钮,它不在文档中,但它可以工作。

(美元)。对话框(按钮:[{id:'你的按钮id'....}]);

然后在函数中使用

$('#your button id') 

禁用它。

您需要设置disabled属性

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

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

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

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