$。单击事件后的循环和动态内容

Question

我想将周期应用于DIV块，并具有动态内容。单击事件后将生成此内容。单击图像后，它无法正常工作。

代码：

$("div.cls img").click(function() {

  ....  Adding the content


 $('#myDiv').cycle({
            fx: 'scrollHorz',
            speed: 3500,
            timeout: 0, continuous: true,
            pause: 1, sync: 1
        }); 
}); 

html：

<div id="myDiv">
 <div>
 <a id="i1"> abc</a>
 <a id="i2"> abcd</a>
 <a id="i3"> abce</a>
   <a id="i4"> abcf</a>
 <a id="i5"> abcg</a>
 <a id="i6"> abch</a>
</div>
 <div>
 <a id="i11"> abc1</a>
 <a id="i21"> abcd1</a>
 <a id="i31"> abce1</a>
   <a id="i41"> abc1f</a>
 <a id="i51"> abcg1</a>
 <a id="i61"> abch1</a>
</div>
</div>

Answer 1

编辑：

尝试打电话 $.cycle() 在添加动态内容后再次。另外，使用Firebug确保您的内容得到正确生成。

如果那不起作用，那么您似乎必须修改周期插件以动态添加“幻灯片”或编写自己的解决方案。

---

从 http://www.malsup.com/jquery/cycle/:

这个怎么运作

该插件提供了一种称为循环的方法，该方法在容器元素上被调用。容器的每个子元素都变成“幻灯片”。选项控制幻灯片如何和何时过渡。

因此，您可以独自离开JavaScript，但是HTML应该看起来像这样：

<div id="myDiv">
  <div>
    <a id="i1"> abc</a>
    <a id="i2"> abcd</a>
    <a id="i3"> abce</a>
    <a id="i4"> abcf</a>
    <a id="i5"> abcg</a>
    <a id="i6"> abch</a>
  </div>
  <div>
    <a id="i11"> abc1</a>
    <a id="i21"> abcd1</a>
    <a id="i31"> abce1</a>
    <a id="i41"> abc1f</a>
    <a id="i51"> abcg1</a>
    <a id="i61"> abch1</a>
  </div>
</div>

另外，您在具有相同ID的页面上绝不应该有一个以上的元素。