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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/23900566/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 01:45:57  来源:igfitidea点击:

How to call javascript methods on click function?

javascript

提问by Leo Costa

I'm trying to use slick carousel (https://github.com/kenwheeler/slick) and they have a method slickNext()which triggers the next slide in the carousel.

我正在尝试使用 slick carousel ( https://github.com/kenwheeler/slick),他们有一种方法slickNext()可以触发轮播中的下一张幻灯片。

Right now my html file looks like this:

现在我的 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>

However this is not working and I can't really figure out why. Thanks

然而,这是行不通的,我真的不知道为什么。谢谢

回答by garrettlynch

Actually a part of RUS's answer is correct. It should be:

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

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

回答by Uxonith

So you are pressing a button to try to get the slick slider to move to the next slide. You need the .for line that handles the click, and then the slickNext()is handled by the slider, so it should be as follows:

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

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

回答by Subhojit Mondal

$('.fa-angle-right').slick('slickNext');

You have first call the slick object then pass the parameter "slickNext always.

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

回答by Dishan TD

$('#banner-side-btns .s-prev').click(function(){
    $("#banner-carousel").slick("slickPrev");
});
$('#banner-side-btns .s-prev').click(function(){
    $("#banner-carousel").slick("slickNext");
});

回答by RUS

Try this:

试试这个:

$("fa-angle-right").slick('slickNext');

回答by relizondo6

Using .slick('slickNext')instead of .slickNext()should do the trick:

使用.slick('slickNext')而不是.slickNext()应该可以解决问题:

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

回答by Quentin

fa-angle-rightis a type selector. It will select <fa-angle-right>elements.

fa-angle-right是一个类型选择器。它将选择<fa-angle-right>元素。

Your italic element (why are you using an italic element?!) is a member of the classfa-angle-right, so you need to use a class selectorwhich starts with a .character.

您的斜体元素(为什么要使用斜体元素?!)是class的成员fa-angle-right,因此您需要使用以字符开头类选择器.

$(".fa-angle-right")

回答by Mzn

This selector can't be correct $("fa-angle-right")because this means it will search for an elementcalled !

这种选择可能是不正确的$("fa-angle-right"),因为这意味着它将搜索的元素称为!

I think what you want is the class selector which must start with a dot:

我认为您想要的是必须以点开头的类选择器:

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

So jQuery selectors work in a very similar way to CSS selectors :)

所以 jQuery 选择器的工作方式与 CSS 选择器非常相似:)