Question

我正在使用翻书插件Jquery Booklet，其中一个功能是转到翻书中的特定页面。

.booklet("gotopage", index)

我正在制作一个包含小缩略图布局的模态，我希望能够点击缩略图，关闭模态，小册子页面将打开图像所在的特定页面。我正在尝试下面的代码，这是第一次工作，但不是后续的时间。任何帮助将不胜感激！

 $('.item a .counter').click(function(e){
   e.preventDefault();
   var gotoimage = $(this).text();
    $('#mybook').booklet("gotopage", gotoimage);
    $('#thumbs').modal('hide');
   });

Answer 1

在绑定发生后，可能是你的模态动态注入到DOM中，在这种情况下，你可以使用一些委托，

 $(document).on('click','.item a .counter',function(e){
   var gotoimage = $(this).text();
    $('#mybook').booklet("gotopage", gotoimage);
    $('#thumbs').modal('hide');
    return false;
   });

Answer 2

$（'。item a .counter'）是否被动态加载？或者它们是否在开头都加载到页面中？

如果在加载页面后加载它们，则应尝试使用.live而不是.click

你在jsfiddle中有这个吗？

Answer 3

在对原始代码感到沮丧之后，我想出了如何使用此代码执行此操作：

$(".item a").click(function () {
var index = $(".item a").index(this) + 2;
$('#mybook').booklet("gotopage", index);
$('#thumbs').modal('hide');
return false;
});

由于我的Thumb图库和Booklet Flipbook具有相同的图像索引，因此可以使用。我只需要添加+ 2，因为我意识到Booklet有一个封面和封底，所以我需要索引开始2个数字，而不是0。

Jquery点击功能只触发一次

3 个答案: