Question

我已经设置了使用cycle2插件的设置，但是寻呼机区域内的链接不起作用，除非您右键单击它并在新窗口中打开＆＃39;。建议？

<div class="cycle-slideshow" data-cycle-fx=fade data-cycle-timeout=50000 data-cycle-pager="#no-template-pager" data-cycle-slides="div" data-cycle-pager-template="">
<div id="tab1"><h1>Test Slide One</h1></div>
<div id="tab2"><h1>Test Slide Two</h1></div>
<div id="tab3"><h1>Test Side Three</h1></div>
<div id="tab4"><h1>Test Slide Four</h1></div> 
</div>
<div id="no-template-pager">
<div class="tab1"><p>Lorem ipsum dolor sit amet.</p><p><a href="http://www.google.com">Test Link</a></p> </div>

<div class="tab2"><p>Lorem ipsum dolor sit amet.</p><p><a href="http://www.google.com">Test Link</a></p> </div>

<div class="tab3"><p>Lorem ipsum dolor sit amet.</p><p><a href="http://www.google.com">Test Link</a></p> </div>

<div class="tab4"><p>Lorem ipsum dolor sit amet.</p><p><a href="http://www.google.com">Test Link</a></p> </div>
</div>

请参阅fiddle，请注意，单击寻呼机区域中的链接不会执行任何操作，但如果右键单击该链接，则链接将打开。

Answer 1

我也正在使用cycle2并遇到了同样的问题但是它已经解决了添加data-cyle-pager-eventbubble =“true”或者在我的情况下是pagerEventBubble：true。它会点击DOM上的事件，允许看到并执行href。

我正在使用jquery 1.9.1，代码是：

$(document).ready(function(){
$('.banner-imagem').cycle({
    slides: "li",
    timeout: 0,
    fx: "fadeout",
    speed: 400,
    manualFx: "scrollHorz",
    manualSpeed: 400,
    pager: "#banner-nav",
    pagerTemplate: "#per-slide-template",
    loader: "wait",
    log: false,
    pagerActiveClass: "slide-ativo",
    slideActiveClass: "slide-ativo",
    slideClass: "slide-imagem",
    pagerEventBubble: true
});

}）;

Answer 2

单击时可以在链接上使用stopPropagation，如下所示：

jQuery(document).ready(function(){
    $('#no-template-pager a').click(function (event) {
        event.stopPropagation();
    });
});

Jquery Cycle2链接内部寻呼机区域不起作用

2 个答案: