我正在尝试在我的网站中实现一个JQuery Dialog,询问用户是否真的要删除一个项目。
但是下面的代码不起作用,它只是没有显示对话框onclick。 这是我的代码:
脚本
$(function() {
$( "#delete" ).dialog({
autoOpen: false,
modal: true,
buttons: {
DELETE: function() {$(this).dialog("close");},
CANCEL: function() {$(this).dialog("close");}
},
});
$( ".delete-action" ).click(function() {
$( "#delete" ).dialog( "open" );
});
});
HTML
<div id="delete" title="Delete" style="display: inline-block">
</div>
<button id="pass" class="delete-action"><img src="$base/includes/img/icons/16/trash.png" style="width: 16px; height: 16px;"/></button>
包括+ css
<link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<!-- CSS -->
<style>
.ui-widget-header,.ui-state-default, ui-button{
background:#b9cd6d;
border: 1px solid #b9cd6d;
color: #FFFFFF;
font-weight: bold;
}
</style>
以下是jsfiddle的链接:Code
任何人都可以提供一些帮助,因为我不知道如何解决它:(我在谷歌搜索了很多,也在StackOverflow上搜索,因为有很多类似于我的问题,但没有一个解决方案有效对我来说
感谢您的帮助,问题解决了,所提供的代码是最新的
答案 0 :(得分:2)
您应该将按钮移动到用于创建对话框的div之外
<div id="delete" title="Delete" style="display: inline-block">
</div>
<button class="delete-action">Open</button>