2

所以我今天的问题是关于更新jQuery 模式,以便可以从加载的子模板中的按钮调用它。

就我而言,我使用的是2kb PopEasy modal。在我的 Pyramid 项目中,模态框位于主模板的顶部。打开模式的按钮位于加载到主模板中的子页面模板上。

在此处输入图像描述

<body id="body-dashboard">
    <div id="modalrequest" class="modal">
        <section id="intro-request">
            <h1>The Modal</h1>

加载的模板页面上生成的标记:

<td class="table-request-btn incoming-icon">
    <a href="#modalrequest" class="modalLink">Request Intro</a>
    <button class="modalLink" href="#modalrequest">Request Intro</button>
</td>



现在,Modal jQuery 的设置方式目前无法正常工作。#body-dashboard是主模板中主容器的id。并且.modalLink是加载模板内的按钮上的类。

    // PopEasy for Request Intro
    var modalObj = $('#body-dashboard');
    //var modalObj = $('.modalLink');
    if (modalObj.length && modalObj.modal) {

        modalObj.modal({
            trigger: '.modalLink',
            olay:'div.overlay',
            modals:'div.modal',
            animationEffect: 'fadeIn',
            animationSpeed: 400,
            moveModalSpeed: 'slow',
            background: '000',
            opacity: 0.8,
            openOnLoad: false,
            docClose: true,
            closeByEscape: true,
            moveOnScroll: true,
            resizeWindow: true,
            close:'.closeBtn'
        });
    }



现在,当我第一次遇到这个问题时,我想起了我在尝试以动态创建的类为目标时遇到的一个较旧的问题。

这是解决方案:

$("body").on("click", ".register_unselected", function(){});



我能够使用该技术让我加载的模板按钮触发警报:

$("#body-dashboard").on("click", ".modalLink", function(){
    alert('this works!');
});



但是我仍然没有运气尝试在模态上使用相同的东西

var modalObj = $('#body-dashboard .modalLink');
modalObj.modal({
    trigger: '#body-dashboard .modalLink',



你会如何处理这个问题?您需要查看更多代码吗?

4

1 回答 1

2

加载新模板后,您必须调用 modal init 函数。

于 2013-06-28T15:04:45.870 回答