Question

这是一个关于范围的理论问题，而不是我的代码特定的任何问题，但我会举一个例子说明我尝试做的事情。

当用户从下拉菜单中选择内容时，颜色框会覆盖屏幕并在首页上显示隐藏的<div>。没有使用iframe或没有加载外部html页面。 <div>呈现在同一页面上，但随时随地填充图像。

Colorbox显示<div> s中包含的图像选择。我希望用户能够选择一个图像，并根据他们选择的内容填充下面页面上的表单。

如何从变色框内联演示文稿中获取变量到开头页面上的函数？

我尝试了一些事情并查看了一些类似的例子，但似乎没有任何效果。我见过的例子来自iframe加载不是内联的。

    function presentDifferentPrintings(cardPresentInfo) {

        // prevent submission until we're done here
        allowSubmitField = document.querySelector('#allowSubmit');
        allowSubmitField.value = 'false'; 

        // clear current hidden overlay div
        $( "div" ).remove( ".singleCardInOverlay" );

        // iterate through each printing, get set names, multiverseIDs and release dates to present
        var printingsNum = cardPresentInfo.printings.split("{|}");
        printingsNum.reverse(); // we want to see the latest cards first

        $.each(printingsNum, function(index, setCode) { 

            var setName = setNameCardIsFromField(setCode);
            var thisMultiverseID = getMVIDfromSetCode(cardPresentInfo['name'], setCode);
            var thisID = getIDfromSetCode(cardPresentInfo['name'], setCode);

            // create HTML for each card presentation
            var presentSingleCardHTML = "<div class='singleCardInOverlay' id='ovDiv"+thisID+"' onClick(fillInDetailsFromOverlay('"+thisID+"');) >";
            presentSingleCardHTML += '<img id="overlayImage" src="<?=$localCardImagePresentFolder?>'+thisMultiverseID+'.jpg" />';
            presentSingleCardHTML += '<p class="singleCardTextInOverlay">'+thisMultiverseID+' - '+setName+'</p>';
            presentSingleCardHTML += '</div>';



            // attach new div to hidden div if we have multiverseid
            if (thisMultiverseID != '') {
                $(presentSingleCardHTML).appendTo("#hiddenOverlayDiv");
            }                   
        });         

        $.colorbox({ inline:true, href:"#hiddenOverlayDiv", width:'80%', height:'80%', transition: "fade", opacity:0.85, returnFocus: true, trapFocus: true });

    }

这是我试图调用的函数的简化版本，它存在于召唤彩盒的页面上：

    function fillInDetailsFromOverlay(thisID) {

        alert('success');
    }

有什么想法吗？

Answer 1

解决方案！在和我的孩子一起休息和打牌后........

我的工作方式是使用分配给内置的onComplete事件挂钩的函数调用我的colorbox。而不是在div标签中使用javascript onClick thingo，我现在正在收听点击使用＆quot; singleCardInOverlay＆＃39;在任何图片上class并将该div的id（对应于所选图像）传递给函数。

惊人的休息可以为你的编码做些什么。我希望这有助于某人。

        $.colorbox({ 
                   inline:true, 
                   href:"#hiddenOverlayDiv", 
                   width:'80%', 
                   height:'80%', 
                   transition: "fade", 
                   opacity:0.85, 
                   returnFocus: true,
                   onComplete: function() { 

                            $(".singleCardInOverlay").click(function(){ 
                                fillInDetailsFromOverlay(this.id);
                            });

                        },

                   trapFocus: true
                   });

传递来自＆＃39; inline＆＃39;的信息colorbox到父页面

1 个答案: