我知道,这个问题已经在236个变种中已经出现了。但即使我尝试使用我理解的那些,我的脚本也没有得到正确的行为。我有以下代码(HTML和JS):
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<title>jQuery UI Dialog - Modal form</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script type="text/javascript">
$(function() {
var dialog, form
dialog = $('div#infoDialog').dialog({
autoOpen: false,
height: 600,
width: 500,
modal: true
});
$('#showInfos').click(function(e) {
e.preventDefault();
dialog.dialog('open');
});
});
</script>
</head>
<body>
<div id="infoDialog" title="Eventinfos">
Testeintrag
</div>
<button id="showInfos"><img src="images/apoa.gif" /></button>
<a href="javascript: void(0)" id="showInfos"><img src="images/apoa.gif" /></a>
</body>
</html>
按钮按预期正常工作,但“a href ...”根本不起作用。我已经尝试了所有我能想到的替代方案,比如不要使用img或尝试#而不是javascript: void(0)
或者不使用变量对话框,但总是直接命名,但都没有用。
在示例中几乎相同的代码应该工作正常。我做错了什么?
答案 0 :(得分:3)
我认为问题在于&#34;按钮&#34;正在使用相同的ID。要么更改其中一个的ID,要么将它们都切换为使用类(或其他一些选择器)。
ID必须是唯一的。
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<title>jQuery UI Dialog - Modal form</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script type="text/javascript">
$(function() {
var dialog, form
dialog = $('div#infoDialog').dialog({
autoOpen: false,
height: 600,
width: 500,
modal: true
});
$('.showInfos').click(function(e){
e.preventDefault();
dialog.dialog('open');
});
});
</script>
</head>
<body>
<div id="infoDialog" title="Eventinfos">
Testeintrag
</div>
<button class="showInfos"><img src="images/apoa.gif" /></button>
<a href="javascript: void(0)" class="showInfos"><img src="images/apoa.gif" /></a>
</body>
</html>
&#13;
答案 1 :(得分:2)
使用class="showInfos"
代替id="showInfos"
和js
$('.showInfos').click(function(e) {
e.preventDefault();
dialog.dialog('open');
});
找到jsbin here