Jquery 如何在单个html页面中添加两个相同的adobe edge动画？

我正在使用jquerymobile，不同的页面内容将在一个html页面中

在页面更改（滑动页面）时，其他页面具有相同的边动画，因为所有html内容都位于单个html页面中，只有第一个边动画可以工作，其余的则不工作

我有两个阶段id

<div id="Stage" class="spring_animation"></div>

<div id="Stage2" class="spring_animation"></div>

以下代码用于一个阶段（

jQuery（文档）.ready（函数（）{
jQuery（'[data url=“10.htm”]'）.live（'pageshow'，function（））{
if（$&&$.Edge&&$.Edge.symbol.get（$（“#Stage”））{
$（'#Stage，#Stage>div'）.show（）；
$.Edge.symbol.get（$（“#Stage”）.play（0）；
}
});   
});       

但是，它不起作用

社区里有人能帮我解决这个问题吗

---

我认为，问题在于及其依赖性。

您是否尝试将其应用于当前的两个ID：

<script type="text/javascript">
    $(document).ready(function(){
    jQuery('[data-url="10.htm"]').live('pageshow', function(){

        if($ && $.Edge && $.Edge.symbol.get($("Stage"))){
            $('#Stage, #Stage > div').show();
            $.Edge.symbol.get($("#Stage")).play(0);

        }
    });

    jQuery('[data-url="11.htm"]').live('pageshow', function(){

        if($ && $.Edge && $.Edge.symbol.get($("Stage2"))){
            $('#Stage2, #Stage2 > div').show();
            $.Edge.symbol.get($("#Stage2")).play(0);

        }
    });
});

</script>

$（文档）.ready（函数（）{
jQuery（'[data url=“10.htm”]'）.live（'pageshow'，function（））{
if（$&&$.Edge&&$.Edge.symbol.get（$（“阶段”））{
$（'#Stage，#Stage>div'）.show（）；
$.Edge.symbol.get（$（“#Stage”）.play（0）；
}
});
jQuery（'[data url=“11.htm”]'）.live（'pageshow'，function（））{
if（$&&$.Edge&&$.Edge.symbol.get（$（“Stage2”））{
$（“#Stage2，#Stage2>div”）.show（）；
$.Edge.symbol.get（$（“#Stage2”））.play（0）；
}
});
});

我遵循了本教程，它很有效。

它使用纯javascript显示/隐藏正确的组合。 所有这些都是回调的原因： AdobeEdge.bootstrapCallback（函数（compId）{ //当合成准备好播放时，将调用您的函数 }))

如注释中所述，当合成准备就绪时，将调用此回调。

---

我做了一个在点击按钮时改变构图的工作示例。

请发布一个你尝试过的实时或JSFIDLE。你找到解决方案了吗？你还需要帮助吗？@KonstantinosMargaritis我没有找到一个好的解决方案，但解决方法已经完成。我所做的是删除

id

阶段

并添加类f或者使用getComposition

$.Edge.getComposition（'yourclass'）.play（0）；

将其包装到另一个div容器中。在每个页面上，检查是否存在与class对应的元素。如果没有元素（尚未播放动画），请使用普通方法，否则请使用一个从其放置位置添加的元素和append（）在页面的页面显示中，你解决了这个问题吗？@JD。事实上我忘记了这些东西。我用我之前的评论中解释的同样的东西使它工作。问题不在于jquery。问题在于edge动画…当edge在

stage

div.live（事件，处理程序）中创建its元素时，上面的语法会起作用（事件对象）Returns:jQueryversion已弃用：1.7，已删除：1.9描述：现在和将来为所有匹配当前选择器的元素附加一个事件处理程序。谢谢……我知道，我使用的是v1.8.3。您有没有在及其API中公开过？没有，只有jQuery，但在document.ready中不使用该代码很奇怪，因为您的dom未完全加载。加载时，边缘将在

#stage

div中创建其元素

spring\u edgePreload.js

。当页面再次滑回动画页面时，就绪处理程序中的代码用于再次播放动画（

10.htm

）。如果在第二阶段没有创建元素，我们如何播放？。边缘动画都在单个html页面中，这会导致问题。如果没有adobe边缘动画的曝光，我无法完全说服您我的问题是什么。谢谢您的回答。。。

<script type="text/javascript">
    $(document).ready(function(){
    jQuery('[data-url="10.htm"]').live('pageshow', function(){

        if($ && $.Edge && $.Edge.symbol.get($("Stage"))){
            $('#Stage, #Stage > div').show();
            $.Edge.symbol.get($("#Stage")).play(0);

        }
    });

    jQuery('[data-url="11.htm"]').live('pageshow', function(){

        if($ && $.Edge && $.Edge.symbol.get($("Stage2"))){
            $('#Stage2, #Stage2 > div').show();
            $.Edge.symbol.get($("#Stage2")).play(0);

        }
    });
});

</script>