javascript - 在刷新之前无法在 webview 中加载 javascript

Question

我有一个名为room.html.erb的 html 文件，其中包含一些 js 代码。当我点击一个链接时，它必须加载上面的页面。但是页面加载正确，除了 js 代码。当我刷新它时工作正常。

room.html.erb中的代码

<script src="http://static.opentok.com/v2/js/opentok.min.js" type="text/javascript"></script>

<script>
var apiKey = xxxxxx;//my apikey
var sessionId ="<%=@group.sessionId%>" ;
var token = "<%=@opentok_token%>";
var session;
OT.setLogLevel(OT.DEBUG);

session = OT.initSession(apiKey,sessionId);

session.on
({
    streamCreated: function(event)
    {
        session.subscribe(event.stream,'subscribersDiv',{insertMode: 'append'});
    }
});

session.connect(token,function(error){
    if(error)
    {
        console.log(error.message);
    }
    else{
        session.publish('myPublisherDiv',{width: 320,height: 240});
    }
}); 

</script>

我无法弄清楚为什么会这样。

Answer 1

等到 DOM 被加载？

<script src="http://static.opentok.com/v2/js/opentok.min.js" type="text/javascript"></script>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function(event) { 
    var apiKey = xxxxxx;//my apikey
    var sessionId ="<%=@group.sessionId%>" ;
    var token = "<%=@opentok_token%>";
    var session;
    OT.setLogLevel(OT.DEBUG);

    session = OT.initSession(apiKey,sessionId);

    session.on
    ({
        streamCreated: function(event)
        {
            session.subscribe(event.stream,'subscribersDiv',{insertMode: 'append'});
        }
    });

    session.connect(token,function(error){
        if(error)
        {
            console.log(error.message);
        }
        else{
            session.publish('myPublisherDiv',{width: 320,height: 240});
        }
    }); 
});
</script>

另一种方法

添加

<div id="myPublisherDiv"></div>
<div id="subscribersDiv"></div>