使用jQuery .click（）有麻烦

Question

不知道为什么jquery .click没有触发，请帮忙。 HTML / js可以在这里enter code here https://jsfiddle.net/o2gxgz9r/10192/

即使删除了语句，.click（）也不起作用，我知道由于position = 1，left在启动时不起作用。

Answer 1

我发现您的代码有这一行。

var position = 1;

在您的点击功能内

$('div.left-arrow').click(function() { 
    if (position > 1){
        //your code here
    }
});

因为您的position是1，所以它将永远无法工作。因此，将其2

$('div.left-arrow').click(function() { 
    if (position >= 1){
        //your code here
    }
});

但是，我单击代码position -= 1;两个div部分position -= 1; 它仍然可以工作

希望这个帮助

Answer 2

您的jquery.click触发方式正确。 您已经应用了以下条件：如果仅“ position> 1”会触发，并且您已经初始化了“ position = 1”，这就是为什么它不会触发，一旦设置了“ position> 1”就会触发。

Answer 3

如下定义函数，并通过在浏览器中获取适当的空间来给div适当的CSS。

$('.left-arrow').click(function() { });

Answer 4

有两件事是正确的：

1.此代码：-

$('div.left-arrow').click(function() { 
    if (position > 1){
        //your code here
    }
});

它永远不会前进，因为if condition返回false（因为您已经定义了position =1 ）。

因此，要么将此条件更改为position >= 1要么将position =2; //or more position =2; //or more

2.您的left-arrow和right-arrow div都没有内容。 因此，从物理上讲，它们不会占据浏览器上的任何区域，并且无法单击它们。

因此，添加一些icon/content或添加一些CSS height/width以便可以实际单击。

解决问题的方法：-

加上z-index: 99; 如下所示：

.left-arrow{
    left:0;
    bottom:0;
    z-index: 99;
}
.right-arrow{
    right:0;
    bottom:0;
    z-index: 99;
}

并且不要忘记将条件position >1更改为position >= 1

工作示例： -https : //jsfiddle.net/4ywa7a5x/