javascript弹出并阻止屏幕

时间:2013-05-17 03:12:36

标签: javascript jquery html

我有一个div弹出窗口,出现在按钮点击事件上。我想在向用户显示弹出窗口时禁用屏幕,并在用户通过转义键关闭弹出窗口或关闭div上的按钮时再次启用,如常规对话框。我怎么能用java脚本来做这件事。

3 个答案:

答案 0 :(得分:0)

你可以创建一个覆盖屏幕的“封面”元素,防止用户输入,除了封面顶部(或内部)的内容。

$('#button').click(function() { $('body').append('<div class="cover"></div>'); } );

.cover { width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, 0.5); }

然后您将事件分配给封面,以便当用户点击它或按特定键时,封面会被隐藏。

$('.cover').click(function() { $(this).hide(); });

我强烈建议使用模态插件/脚本,因为自己动手需要付出很大的努力并且非常耗时(相信我)。

答案 1 :(得分:0)

JQuery UI让您的生活更轻松。 看看jquery UI dialog

答案 2 :(得分:0)

您可以使用jQuery对话框并使用属性modal:true

$("#fileuploadfun").dialog({ modal: true });  

如果您使用modal:false,则可以点击背景