0

我有一个小的 nw.js 应用程序,它改变了 index.html 页面的 div 部分:

var myDiv = document.getElementById("outputSection");
var myImg = document.createElement("img");
myDiv.appendChild(myImg);

myImg.src = 'http://127.0.0.2:8080/prime_almost_full_00007.0001.png';
myImg.width = '256';
myImg.height = '256';
myImg.class = 'reel';
myImg.id = 'image';
myImg.setAttribute("data-images", 'http://127.0.0.2:8080/prime_almost_full_00007.####.png|0001..0250');

我试图在我的静态示例中模仿的 HTML 代码是:

<img src='http://127.0.0.2:8080/prime_almost_full_00007.0001.png'width='256' height='256' class='reel' id='image' data-images='http://127.0.0.2:8080/prime_almost_full_00007.####.png|0001..0021'>

我正在使用 Jquery-reels 库。在我的页面顶部,我将其包括在内:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src='http://code.vostrel.cz/jquery.reel.js' type='text/javascript'></script>

出于某种原因,虽然图像显示为第一个代码被剪断,但它不是交互式的。我的静态页面是这样的:

<!DOCTYPE html>
<html>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src='http://code.vostrel.cz/jquery.reel.js' type='text/javascript'></script>

<head>
  <title>Hi there</title>
</head>
<body>
    <div>
    <img src='http://127.0.0.2:8080/prime_almost_full_00007.0001.png' 
         width='256' 
         height='256' 
         class='reel' 
         id='image' 
         data-images='http://127.0.0.2:8080/prime_almost_full_00007.####.png|0001..0021'>
    </div>
</body>
</html>

我不清楚为什么会这样。是关于 node-webkit 的吗?

编辑:重新扫描似乎不起作用:

myDiv.innerHTML = "<img src='http://127.0.0.2:8080/prime_almost_full_00007.0001.png' width='256' height='256' class='reel' id='image' data-images='http://127.0.0.2:8080/prime_almost_full_00007.####.png|0001..0021'>";
$.reel.scan();
4

1 回答 1

1

当页面加载时,reel 插件会自动查找属性为 class="reel" 的元素。有关这方面的更多信息,请参阅带注释的来源

根据该文档,由于您在页面加载后向页面添加元素,因此您可能需要在 javascript 末尾调用 $.reel.scan() 函数。

于 2015-09-17T22:55:26.630 回答