首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >ajax激活在成功时弹出

ajax激活在成功时弹出
EN

Stack Overflow用户
提问于 2014-12-12 04:15:48
回答 2查看 523关注 0票数 0

有一个弹出对话框是由一个按钮激活的,其代码如下:

代码语言:javascript
复制
<div class="button-wrap"><button data-dialog="somedialog" class="trigger">Open Dialog</button></div>

弹出以在按钮单击时激活的代码如下:

代码语言:javascript
复制
<script src="js/classie.js"></script>
<script src="js/dialogFx.js"></script>
<script>
    (function() {

        var dlgtrigger = document.querySelector( '[data-dialog]' ),
            somedialog = document.getElementById( dlgtrigger.getAttribute( 'data-dialog' ) ),
            dlg = new DialogFx( somedialog );

        dlgtrigger.addEventListener( 'click', dlg.toggle.bind(dlg) );

    })();
</script>

其中触发器按钮具有数据属性数据-对话框=“某某对话框”。

对话框本身的html代码如下:

代码语言:javascript
复制
<div id="somedialog" class="dialog">
                    <div class="dialog__overlay"></div>
                    <div class="dialog__content">
                        <div class="morph-shape">
                            <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 560 280" preserveAspectRatio="none">
                                <rect x="3" y="3" fill="none" width="556" height="276"/>
                            </svg>
                        </div>
                        <div class="dialog-inner">
                            <h2><strong>Howdy</strong>, I'm a dialog box</h2>
                            <div><button class="action" data-dialog-close>Close</button></div>
                        </div>
                    </div>
                </div>

注意到:对话框和激活它的按钮都共享属性“”。

但是,我希望将弹出与ajax集成起来,以便在ajax返回success/done时自动调用弹出(没有绑定)。我的ajax代码正在工作,弹出的HTML/CSS代码也已经被编码了。

问题是如何在ajax成功后将按钮激活转换为自动激活?

谢谢!

EN

回答 2

Stack Overflow用户

发布于 2014-12-12 05:35:58

基本上,dlg.toggle.bind(dlg)具有单击功能。

就像这样触发

代码语言:javascript
复制
dlg.toggle.bind(dlg)()

工作小提琴

票数 0
EN

Stack Overflow用户

发布于 2014-12-14 03:45:03

实际上,答案是在ajax代码中添加这两行代码来附加新的模式:

window.dlg =新DialogFx( window.somedialog );dlg.toggle.bind(dlg)();

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/27436765

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档