jQuery Reel 插件：动态显示或隐藏卷轴图像答案

【问题标题】：jQuery Reel Plugin: showing or hiding the reel image dynamicallyjQuery Reel 插件：动态显示或隐藏卷轴图像
【发布时间】：2014-07-22 07:53:32
【问题描述】：

对不起，我的英语不好。

我尝试使用 jQuery Reel Plugin，它在我的 html 文件上完美运行。

 <img src="DSCN0691.jpg" width="210" height="186"
  class="reel"
  id="image1"
  data-images="fish/DSCN####.JPG|691..702">

但是如果我通过document.innerHTML添加脚本，就完全不行了。

图片会显示出来，但我不能卷起来。

document.getElementById('Hello').innerHTML='<img src="fish/DSCN0691.JPG" width="210" height="186" class="reel" id="image2" data-images="fish/DSCN####.JPG|691..702">';

我也试过element.setAttribute(name, value)函数，或使用 jQuery 加载整个 html 文件。但结果是一样的……

不知道现在该做什么。

或者是否有任何其他解决方案可以动态显示和隐藏卷轴图像？

非常感谢。

下面是整个脚本和项目。

JQuery Reel Project

 <script language="JavaScript">
 function WriteToFile(passForm) {       

document.getElementById('Hello').innerHTML='<img src="fish/DSCN0691.JPG" width="210" height="186" class="reel" id="image2" data-images="fish/DSCN####.JPG|691..702">';

 }
 </script>

<head>
    <script src='http://code.jquery.com/jquery-1.9.1.min.js'></script>
    <script src='jquery.reel.js' ></script>
</head>

<body>  
  <div id="Hello"></div>    
  <input type="button" value="submit" onclick="WriteToFile(this);">

  <img src="DSCN0691.jpg" width="210" height="186"
    class="reel"
    id="image1"
    data-images="fish/DSCN####.JPG|691..702">
  </body>

【问题讨论】：

标签： javascript jquery html jquery-reel

【解决方案1】：

卷轴插件在文档加载时使用“卷轴”类初始化所有图像。如果之后更改 HTML Dom，则需要初始化添加的图像。您可以通过以下 javascript 来执行此操作：

$('#image').reel({
    images: 'fish/DSCN####.JPG|691..702'
});

【讨论】：