如何在点击功能上调用javascript方法?

Leo*_*sta 2 javascript

我正在尝试使用光滑的旋转木马(https://github.com/kenwheeler/slick),他们有一个slickNext()触发旋转木马下一张幻灯片的方法.

现在我的html文件看起来像这样:

<div class="slick-slider">
  <div><%= image_tag "1.jpg"%></div>
  <div><%= image_tag "1.jpg"%></div>
  <div><%= image_tag "1.jpg"%></div>
</div>

<i class="fa fa-angle-right"></i>


<script type="text/javascript">
$("fa-angle-right").click(function(e) {
    $("fa-angle-right").slickNext();
});
</script>

<script type="text/javascript">
    $(document).ready(function(){
        $('.slick-slider').slick({
            dots: true
        });
    (jQuery)});
</script>
Run Code Online (Sandbox Code Playgroud)

但是这不起作用,我无法弄清楚原因.谢谢

gar*_*nch 9

实际上RUS答案的一部分是正确的.它应该是:

<script type="text/javascript">
$('.fa-angle-right').click(function() {
    $('.fa-angle-right').slick('slickNext');
});
</script>
Run Code Online (Sandbox Code Playgroud)


Uxo*_*ith 5

所以你按下一个按钮试图让光滑的滑块移动到下一张幻灯片.您需要.处理该行的for行,click然后slickNext()由滑块处理,因此它应如下所示:

<script type="text/javascript">
$(".fa-angle-right").click(function(e) { // Added a '.'
    $(".slick-slider").slickNext(); // Switched to '.slick-slider'
});
</script>
Run Code Online (Sandbox Code Playgroud)

  • 不确定它是否是旧版本,但是目前,你调用这样的光滑方法:$('.slick-slider').slick('slickNext'); (6认同)

Sub*_*dal 5

$('.fa-angle-right').slick('slickNext');
Run Code Online (Sandbox Code Playgroud)

您首先调用 slick 对象,然后始终传递参数“slickNext”。