Joa*_*ora 5 javascript jquery jquery-ui
我无法获得一个jQuery UI 模式对话框,它可以像在演示中一样工作!考虑这个食谱:
<html>
<head>
<script type="text/javascript" src="/javascripts/jquery.js"></script>
<script type="text/javascript" src="/javascripts/jquery-ui.js"></script>
</head>
<body>
<p>First open a modal <a href="" onclick="$('<div>something</div>').dialog({modal: true}); return false;"> dialog</a></p>
<p>Then try to hover over <a href="broken"> me</a></p>
<p>And <a onclick="alert('clicked!'); return false;" href="alsobroken"> click me!</a></p>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
当对话框处于活动状态时,第二个链接被正确禁用,但第三个链接(onclick)仍然有效!此外,当悬停两个链接时,会出现一个小浏览器手.这不像演示......我做错了什么?
正如Pointy指出的,这通常由 jQueryUI CSS 控制。但是我们可以通过在 CSS 文件中添加一些稍微有点 hackish 的代码片段来解决这个问题。
.ui-widget-overlay {
height:100%;
left:0;
position:absolute;
top:0;
width:100%;
}
Run Code Online (Sandbox Code Playgroud)
这样,“shroud”div 就会覆盖所有按钮,并且无需使用 jQueryUI CSS。