在过去的几周里我刚刚开始使用 jQuery，并且真的很喜欢它 - 太棒了！不过我现在有一个问题。这是我的页面的基本结构：
<body>
<div id="accordionContainer">
<div class="accordionSectionHeader">
Some header label...
</div>
<div class="accordionSectionContent">
Some content...
<a href="#">Popup dialog</a>
</div>
</div>
<div id="dialog">
Some dialog content here...
</div>
</body>
这是一个相当简单的布局 - 当您单击“弹出对话框”链接时，对话框 div 将显示，位于链接顶部。到目前为止，一切都很好。现在我遇到了问题 - 我已将对话框模式选项设置为“true”，但我仍然可以单击下面的内容，包括手风琴部分标题！我在这里错过了什么吗？我一生都无法弄清楚出了什么问题，因为我是这里的新手。
任何建议或帮助将不胜感激。
非常感谢，
丹妮.
I have just started using jQuery in the past couple of weeks and am really enjoying it - damn fantastic thing! I have one problem at the moment though. Here's the basic structure of my page:
<body>
<div id="accordionContainer">
<div class="accordionSectionHeader">
Some header label...
</div>
<div class="accordionSectionContent">
Some content...
<a href="#">Popup dialog</a>
</div>
</div>
<div id="dialog">
Some dialog content here...
</div>
</body>
It's a fairly straightforward layout - when you click the "Popup dialog" link the dialog div shows, positioned over the top of the link. So far so good. Now I have struck problem - I have set the dialog modal option to "true" but I can still click on stuff underneath, including accordion section headers! Have I missed something here? Can't for the life of me figure out what's going wrong since I'm very much a newbie here.
Any suggestions or assistance would be greatly appreciated.
Many thanks,
Dany.
发布评论
评论（1）
第一印象：
使用 firebug 检查代码中某处是否有一个 div 被绘制到屏幕（等），因为 jQuery 喜欢阻止模式下交互的方式是用屏幕大小的空 div 来阻止你。
另请检查元素的 Z-Index 属性，以确保折叠式菜单没有位于该拦截器之上。
一旦有某种形式的代码，就会返回:)
编辑
您发布的代码缺少 JQuery UI css 文件。与 UI js 文件一起下载的 css 文件控制 UI 元素的格式。
您可能不需要整个文件，因为它会影响您使用的每个 jquery UI 小部件，但您确实需要的重要行是：
First impressions:
Use firebug to check whether there is a div being drawn to the screen ( etc) somewhere in the code, as the way jQuery likes to block interaction underneath a modal is by blocking you with a screen sized empty div.
Also check the Z-Index property of your elements to make sure the accordion menu isn't sitting ontop of that blocker.
Will head back once there is some form of code :)
EDIT
Your code that you posted through is missing the JQuery UI css file. The css file that downloads with the UI js files controls the formatting of UI elements.
You may not want the whole file, because it will affect every jquery UI widget you use, but the important line you do need is: