如何从函数中禁用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');
      }
    }
  })
});

当前回答

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

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

2011-08-04 10:06:00

其他回答

我创建了一个jQuery函数，以便使这个任务更容易一些。只需添加到你的JavaScript文件:

$.fn.dialogButtons = function(name, state){
var buttons = $(this).next('div').find('button');
if(!name)return buttons;
return buttons.each(function(){
    var text = $(this).text();
    if(text==name && state=='disabled') {$(this).attr('disabled',true).addClass('ui-state-disabled');return this;}
    if(text==name && state=='enabled') {$(this).attr('disabled',false).removeClass('ui-state-disabled');return this;}
    if(text==name){return this;}
    if(name=='disabled'){$(this).attr('disabled',true).addClass('ui-state-disabled');return buttons;}
    if(name=='enabled'){$(this).attr('disabled',false).removeClass('ui-state-disabled');return buttons;}
});};

使用类'dialog'禁用对话框中的'OK'按钮:

$('.dialog').dialogButtons('Ok', 'disabled');

启用所有按钮:

$('.dialog').dialogButtons('enabled');

启用“关闭”按钮并更改颜色:

$('.dialog').dialogButtons('Close', 'enabled').css('color','red');

我希望这能有所帮助。

2010-10-14 19:33:16

下面是一个jQuery对话框的enableOk函数:

function enableOk(enable)
{
    var dlgFirstButton = $('.ui-dialog-buttonpane').find('button:first');

    if (enable) {
        dlgFirstButton.attr('disabled', '');
        dlgFirstButton.removeClass('ui-state-disabled');
    } else {
        dlgFirstButton.attr('disabled', 'disabled');
        dlgFirstButton.addClass('ui-state-disabled');
    }
}

“第一”按钮是最右边的那个。您可以禁用按钮并设置对话框的禁用类，以获得适当的视觉效果。

2009-12-13 13:08:41

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

例子:

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

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

2010-10-29 08:33:32

禁用按钮:

var firstButton=$('.ui-dialog-buttonpane button:first');
firstButton.addClass('ui-state-disabled');

如果页面上有多个对话框，则必须添加对话框id。

2009-08-11 14:20:27

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

$(".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

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

推荐文章

最新文章

标签