关闭对话框时的效果

时间:2012-10-25 06:43:56

标签: jquery

使用Jquery Dialog框。在这里我有提交和关闭按钮。我想为关闭按钮添加here之类的UI效果。

我的Dialog box代码位于下方,

$(document).ready(function() {
    $("#disableDivForm").dialog({
        autoOpen: true,
        position: 'center',
        height: 187,
        width: 472,
        modal: true,
        show: {
            effect: 'explode',
            duration: 400
        }
    });
    $('#body').show();
});​

disableDivForm内有一个关闭按钮。代码如下,

<div id="disableDivForm" name="disableDivForm">
    <input type="submit" id="cancelID" value="Close" onClick="return cancel()" class="but-bl2"/>
</div>

function cancel()
{
    document.disableForm.action=" - myAction goes here - "; 
    document.disableForm.method="POST";
    document.disableForm.submit(); 
}

我尝试使用以下代码来实现效果。

$(document).ready(function(){
    $("#cancelID").click(function(){
       hide: {effect: 'explode', duration: 400}
    });
});

但是,它不起作用。我的对话框本身没有打开。没有Java Script错误。我在<div id="disableDivForm">

中放置了.click函数的代码

1 个答案:

答案 0 :(得分:1)

检查这个小提琴jsfiddle,可能就是你想要的。您可以在初始化对话框期间添加隐藏效果

  $("#disableDivForm").dialog({
    autoOpen: true,
    position: 'center',
    height: 187,
    width: 472,
    modal: true,
    show: {
        effect: 'explode',
        duration: 400
    },
    hide: {
        effect: 'explode',
        duration: 400
    }
});