禁用“X”在对话框

Question

可能重复的右上角的按钮：
Remove close button on jQueryUI Dialog?

我试图让，要求用户在继续之前达成协议的对话，并且不想让用户只需点击对话框右上角的'X'即可关闭。我想要求用户点击“我同意”。

有什么办法可以禁用对话框中的'X'吗？

澄清：我只是使用标准的jQuery UI对话框：$ .dialog（）。

Answer 1

我假设你正在使用jQuery UI。

如果是这样，请附加一个beforeClose事件处理函数，并在未点击Agree按钮的情况下返回false。您还可以使用CSS来设置X键{display: none}

var agreed = false; //has to be global 
$("something").dialog({ 
    buttons: { 
     'Apply': function() { 
      agreed = true; 
      $(this).dialog("close"); 
     } 
    }, 
    beforeClose: function() { 
     return agreed; 
    } 
}); 

Answer 2

如果您的对话框是常规弹出窗口，则无法阻止用户关闭该窗口。

您可以使用jQuery模态对话框插件，如jqModal。

但是，请注意，您无法阻止用户关闭主窗口。

---

编辑：如果您正在使用jQuery UI的对话框，您可以添加以下CSS规则：

#someId .ui-dialog-titlebar-close { 
    display: none; 
} 

您shouldalso设置closeOnEscape到false。

---

而且，你为什么迫使用户点击I Agree？
为什么你不能像对待你不同意一样关闭窗户？

Answer 3

如果您使用alert，也许你应该考虑confirm代替：

if (!confirm("Click OK to confirm that you agree to the terms and conditions.")) { 
    // they didn't click OK 
} else { 
    // they did. 
} 

或者，使用a plugin像SLaks提到

Answer 4

至于你不允许用户点击X的任务，我会推荐几种方法之一：

1. 使用CSS规则将该按钮的显示设置为'none'。使用Firebug的Inspect模式，您应该能够查看jQuery UI对话框所在的标签并为其添加CSS规则。如果显示为无，则用户不应该能够点击它。
2. 同样，附加一个jQuery .click（）事件什么都不做，并返回false来停止事件传播（我从来没有真正做过这件事，但它应该可以工作）。
3. 如果用户没有点击“我同意”，您可以在对话框的BeforeClose（）事件中附加一个函数，以防止对话框关闭。
4. 最复杂的，但如果你想有类似的对话框或进行其他功能更改，您可以通过创建一个jQuery UI插件子类化jQuery UI插件，该插件可在内部实例化对话框，然后通过应用CSS规则或附加事件来修改默认行为，如上所述。

希望其中的一个可以让你在正确的方向前进......

Answer 5

注意到，在该对话框的标题栏创建的div有一首咏叹调，labelledby属性引用您的对话框（UI-对话框的标题 - {yourDialogName}），所以我只是用下面的CSS隐藏了“x”：

div.ui-dialog[aria-labelledby="ui-dialog-title-myDialog"] a.ui-dialog-titlebar-close { 
    display: none; 
}

我还设置了closeOnEscape为false来防止这种情况。

Answer 6

我添加了一个相关的问题：在用户单击X关闭特定的对话框窗口后重新加载，不在其他窗口重新加载。我加入jQuery的对话功能的.js：

.click(function(i){ jQuery('span.ui-dialog-title').each(function(index) { 


    if (jQuery(this).text() == '/**Title String Here**/') { 

     a.close(i); location.reload(true); 

    } else { 

     a.close(i); 
    } 

    }); 
return false}) 

这看起来在跨越的文本标题，并在接近并重新加载，否则关闭没有重装。

Answer 7

只是补充迈克尔梅多斯的答案。如果您有多个表单并且不想拥有全局变量，那么您可以将一个属性添加到表单DOM元素。喜欢的东西：

$('#yourForm').dialog(
open : function(){ 
    $('#yourForm').attr('agreed', false); 
}, 
beforeClose : function(){ 
    return $('#yourForm').attr('agreed') == 'true'; 
}, 
buttons:{'OK':function(){ 
     $('#yourForm').attr('agreed', true);   
     $(this).dialog('close'); 
    }, 
    'Cancel' : function(){ 
     $('#yourForm').attr('agreed', false); 
     $(this).dialog('close'); 
    } 
} 
); 

我想你，因为我觉得attr属性存储为字符串“真”，而不是唯一真正的比较。但我不知道这一点....

Answer 8

我发现这在另一个帖子，希望有帮助，它为我工作：

$("#div2").dialog({ 
    closeOnEscape: false, 
    open: function(event, ui) { $(".ui-dialog-titlebar-close").hide(); } 
}); 

这是链接：

How to remove close button on the jQuery UI dialog?