jQuery Cycle 插件动态函数

Question

试图使这个函数动态而不是静态。

这是有效的原始代码

$('#goto1').click(function(e) {
    e.preventDefault();
    $('#slider').cycle(1);
});

这是动态函数（不起作用）。警报输出正确的 id，但滑块不会循环。

$('.cycle_goto').live('click', function(e) {
    e.preventDefault();
    var cycle_id = $(this).attr('id').substr(4);
    alert ('##'+cycle_id+'##');
    $('#slider').cycle(cycle_id);
});

该网页如下所示：

<div id="slider">
    <img class="slide" src="<?=FE_URL;?>images/slide1.jpg" style="position: relative !important;" alt="Slide 1.">
    <img class="slide" src="<?=FE_URL;?>images/slide2.jpg" alt="Slide 2">
    <img class="slide" src="<?=FE_URL;?>images/slide3.jpg" alt="Slide 3">
</div>
<div class="slider_nav">
    <ul id="slider_nav_ul">
        <li><a class="cycle_goto" id="goto1" href="#">Hotel &amp; Residence<span class="arrow"><!--  --></span></a></li>
        <li><a class="cycle_goto" id="goto2" href="#">Yacht Charter<span class="arrow"><!--  --></span></a></li>
        <li><a class="cycle_goto" id="goto3" href="#">Properties<span class="arrow"><!--  --></span></a></li>
    </ul>
</div>

编辑

通过使用以下代码将元素 id 转换为整数来使其工作：

$('.cycle_goto').live('click', function(e) {
    e.preventDefault();
    var myString = $(this).attr('id').substr(4);
    var myInteger;
    myInteger = parseInt(myString);
    var cycle_id = myInteger;
    $('#slider').cycle(cycle_id);
});

Answer 1

您使用$('#slider').cycle(1);在逻辑上是无效的。

语法是$('#slideshow').cycle('command');的，因此您无法选择转到元素。

编辑：

您可以选择转到一个元素或通过更改 API 中的选项来选择一组元素：

slideExpr：空，//用于选择幻灯片的表达式（如果有的话） 除所有儿童外为必填项）

例如：$('#slider').cycle({ slideExpr: $('#slider .child') });