Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/384.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 当点击最后一张幻灯片上的下一页时,转到Wordpress中的下一页?_Javascript_Jquery_Wordpress_Bxslider - Fatal编程技术网

Javascript 当点击最后一张幻灯片上的下一页时,转到Wordpress中的下一页?

Javascript 当点击最后一张幻灯片上的下一页时,转到Wordpress中的下一页?,javascript,jquery,wordpress,bxslider,Javascript,Jquery,Wordpress,Bxslider,我每页放映12张幻灯片。在最后一张幻灯片中,当我点击下一页时,我希望它转到wordpress的下一页。我使用的是wp pagenavi,所以我所需要的就是模拟点击.nextpostslinks 使用bxslider、wordpress和自定义寻呼机 $(函数(){ $('.bx next')。单击(函数(){ 风险值指数=$('.col-xs-1 a.active')。数据('slide-index'); 如果(索引=11){ $('.bx next')。单击(函数(){ event.prev

我每页放映12张幻灯片。在最后一张幻灯片中,当我点击下一页时,我希望它转到wordpress的下一页。我使用的是wp pagenavi,所以我所需要的就是模拟点击.nextpostslinks

使用bxslider、wordpress和自定义寻呼机

$(函数(){
$('.bx next')。单击(函数(){
风险值指数=$('.col-xs-1 a.active')。数据('slide-index');
如果(索引=11){
$('.bx next')。单击(函数(){
event.preventDefault();
$('.nextpostslink')。单击();
});
};
});
});
  • 使用bxSlider API,我们使用以下方法和回调:

    • :此回调在幻灯片转换之前激发

    • :此方法将返回幻灯片总数

  • 更重要的是,我们使用的jQuery方法将 允许我们远程单击
    $('.nextPostLink')

顺便说一句,如果你有12张幻灯片,那么就用13张

详细信息在代码段中注释

片段

$(函数(){
//实例化bxSlider并将其存储在var中
变量bx=$('.bx').bxSlider({
//回调在下一张幻灯片之前,调用nextPage()
onSlideBefore:下一页,
滑动宽度:150,
});
/*在每张幻灯片之前,此功能将。。。
||获取最后一张幻灯片。。。
||将最后一张幻灯片与当前索引幻灯片进行比较。。。
||…如果它们的价值相等。。。
||…触发器()方法将触发。。。
||…合成点击至.nextPostLink。
*/
功能下一页($ele,from,to){
var last=(bx.getSlideCount()-1);
var指数=parseInt(到,10);
如果(最后一个===索引){
$('.nextPostLink')。触发器('click');
}
}
});
/*此函数用于演示.nextPostLink。。。
||…在bxSlider滑入。。。
||…最后一张幻灯片。如果成功,将显示Lenna的图像
*/
$('.nextPostLink')。单击(函数(){
$(this.css('background-image','url(http://imgh.us/Lenna.png)');
});
.nextPostLink{
高度:150像素;
宽度:150px;
背景尺寸:包含;
位置:相对位置;
底部:200px;
颜色:青色
}


下一个帖子链接
效果很好,我不得不做一些修改,因为我使用的是自定义寻呼机,IDK触发器不起作用。var link=$('.nextpostslink').attr('href');console.log(索引+'/'+last);如果(last==index){$('.bx next')。单击(function(){window.location.href=link;})太好了,我很高兴它有帮助,并且您成功地解决了差异(这种情况很少发生),编码也很愉快。