首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >在触发jQuery分页后,Lightbox不再工作(jQuery和lightbox冲突)

在触发jQuery分页后,Lightbox不再工作(jQuery和lightbox冲突)
EN

Stack Overflow用户
提问于 2011-07-07 20:11:38
回答 2查看 1.4K关注 0票数 2

我们同时使用两个脚本:prettyPhotojQuery分页。当页面第一次加载时,这两个脚本都正常工作。但是,当我单击分页的第2页时,灯箱将不再显示,但我仍然可以从一个页面转到另一个页面。这两个脚本都是初始化脚本:

jQuery分页:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<script type="text/javascript">

            // This is a very simple demo that shows how a range of elements can
            // be paginated.
            // The elements that will be displayed are in a hidden DIV and are
            // cloned for display. The elements are static, there are no Ajax 
            // calls involved.

            /**
             * Callback function that displays the content.
             *
             * Gets called every time the user clicks on a pagination link.
             *
             * @param {int} page_index New Page index
             * @param {jQuery} jq the container with the pagination links as a jQuery object
             */
            function pageselectCallback(page_index, jq){
                var new_content = jQuery('#hiddenresult div.result:eq('+page_index+')').clone();
                $('#Searchresult').empty().append(new_content);
                return false;
            }

            /** 
             * Initialisation function for pagination
             */
            function initPagination() {
                // count entries inside the hidden content
                var num_entries = jQuery('#hiddenresult div.result').length;
                // Create content inside pagination element
                $("#Pagination").pagination(num_entries, {
                    callback: pageselectCallback,
                    items_per_page:1 // Show only one item per page
                });
             }

            // When document is ready, initialize pagination
            $(document).ready(function(){                  
                initPagination();
            });
</script>

prettyPhoto:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<script type="text/javascript" charset="utf-8">
  $(document).ready(function(){
    $("a[rel^='prettyPhoto']").prettyPhoto();
  });
</script>

有人知道冲突在哪里吗?谢谢。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2011-07-07 22:39:37

我找到了解决我的问题的方法(我在另一个论坛上找到了):

我只需要插入$(“rel^=‘prettyPhoto’”).prettyPhoto();在函数pageselectCallback中插入如下所示:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
function pageselectCallback(page_index, jq){
                var new_content = jQuery('#hiddenresult div.result:eq('+page_index+')').clone();
                $('#Searchresult').empty().append(new_content);
                $("a[rel^='prettyPhoto']").prettyPhoto();
                return false;
            }

如果我能把+1给回答它的人,这里。:)

票数 2
EN

Stack Overflow用户

发布于 2011-07-07 20:34:29

尝试使用Jquery .delegate()

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
$("a").delegate("[rel^='prettyPhoto']", "load", function()
    {

        $("a[rel^='prettyPhoto']").prettyPhoto();

    });
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/6619888

复制
相关文章
6款 jQuery Lightbox图片查看触控插件
偶然间在网上看到的几个图片预览的插件,挺好用的,顺手整理下来。 1:Zoomify – jQuery缩放效果lightbox插件 地址:http://www.dowebok.com/214.html
王小婷
2018/09/26
4.8K0
6款 jQuery Lightbox图片查看触控插件
Lightbox
Lightbox (燈箱),用来放大显示图片覆盖于当前页面之上。其是用 CSS 来定义图片容器,用一幅半透明的 png 图片实现渐变阴暗的效果。
Cell
2022/02/25
7640
基于 jQuery支持移动触摸设备的Lightbox插件:Swipebox使用说明
Swipebox是一款支持桌面、移动触摸手机和平板电脑的jquery Lightbox插件。该lightbox插件支持手机的触摸手势,支持桌面电脑的键盘导航,并且支持视频的播放。
李维亮
2021/07/09
1.7K0
基于jQuery 常用WEB控件收集
基于Jquery开发的Autocomplete插件。具有易于使用,配置简单,既可以利用Ajax读取数据也可以直接从本地获取数据。
全栈程序员站长
2022/07/05
7.5K0
仿百度排列图片预览插件-Simple Lightbox
很久以前遇到过这样的一个面试题,要求手写代码,实现百度图片的排列预览,并且可以左右点击查看下一张照片,当时没有做出来,这个问题也就一直放在了脑后,工作之后,遇到这样的需求之后,第一反应想到的是在源码网站里面找一个插件,方便省事,不在像从前那般手敲代码,一敲就是一整天的感觉。
王小婷
2018/09/26
1.7K0
仿百度排列图片预览插件-Simple Lightbox
jquery和vue冲突吗_jquery和vue的区别
一个h5项目同时引用了vue.js和jquery.js, 发现jquery绑定的事件失效。
全栈程序员站长
2022/11/08
1.4K0
一款lightbox图片幻灯片浏览插件
    之前移植emlog时就发现lightbox图片幻灯片浏览插件了,因为移植过程中出现了很大的困难,所以没有及时把教程写出来,今天抽空再研究了一下,才把这个lightbox图片幻灯片浏览插件教程写出来     如果你要使用这款插件,那么一定需要引用jquery插件库,但是jquery的版本不能太高,版本过高不能正常使用,推荐jquery.min.js-1.7.1的版本,附件中也是1.7.1的版本     其次你需要引用一个jquery.lightbox.css和一个jquery.lightbox.
Youngxj
2018/06/06
2.6K0
JQuery的$命名冲突
在Jquery中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,如$('#msg')等同于JQuery('#msg')的写法。然而,当我们引入多个js库后,在另外一个js库中也定义了$符号的话,那么我们在使用$符号时就发生了冲突。下面以引入两个库文件jquery.js和prototype.js为例来进行说明。  第一种情况:jquery.js在prototype.js之后进行引入,如:
阳光岛主
2019/02/19
1.3K0
Jekyll x Markdown 图片美化 - Lightbox.js
昨天写了一篇游记,Karmdown 里面的图片不会自适应,导致有些图片大有些图片小,当然我才懒得给每个图片加 width 和 height!
szhshp
2022/08/21
2.1K0
Jekyll x Markdown 图片美化 - Lightbox.js
jquery 实现分页 前端分页
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title> </title> <link href="style.css" rel="stylesheet" type="text/css" /> <script src="../../scripts/jquery.js" type="text/javascript"></script> <script type="text/javascript">
用户5760343
2019/10/10
2.7K0
jquery 实现分页 前端分页
前端组件库_前端组件库有什么好处
发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/168343.html原文链接:https://javaforall.cn
全栈程序员站长
2022/09/20
6.4K0
vue分页轮播_jquery分页插件
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
全栈程序员站长
2022/11/14
5.5K0
jquery.datatables 分页功能
Datatables 插件的基本用法就不再介绍了,这里主要分享一下使用它实现服务器端获取数据时的分页处理。
用户7293182
2022/01/17
5K0
jquery.datatables 分页功能
在vue项目中使用jquery和jquery插件
Vue之所以受欢迎,主要就在于它的轻量和灵活,我们可以用vue做SPA,也可以用它做多页应用,一个页面对应一个VUE实例。而且因为他的轻量,低侵入性,所以我们可以很方便地和其他框架或者库搭配使用,那么我们怎么在基于vue的SPA应用中搭配jquery使用呢?
fastmock
2022/07/13
1.6K0
jQuery - noConflict() 方法介绍-解决jQuery与其他框架冲突的问题
这个方法可能不是很常见,这个是jQuer提供的一个方法,说一下应用场景,比如说,我们使用jQuery的时候,需要引入别的框架,那么刚好这个框架也是$开头的,那是不是很悲催,因为jQuery也是$开头的,那么页面怎么解析呢?导致的结果可能就是页面停止加载了,说人话就是页面就基本挂了!所以jQery也考虑到了这个问题,就出现了jQuery - noConflict() 方法。
何处锦绣不灰堆
2020/05/29
8000
SpringMVC+jquery.pagination分页显示
最近在做ES全文搜索,需要做个类似于百度搜索下面分页的组件。 找了很多,最后发现jquery.pagination实现分页很方便。
程裕强
2022/05/06
1.4K0
SpringMVC+jquery.pagination分页显示
Jquery前端分页插件pagination使用
插件描述:JqueryPagination是一个轻量级的jquery分页插件。只需几个简单的配置就可以生成分页控件。并且支持ajax获取数据,自定义请求参数,提供多种方法,事件和回调函数,功能全面的分
王小婷
2018/06/01
4.4K0
jquery如何模拟分页-小白进阶
tips:上面代码没有初始化第一页数据,点击一下才会出来第一页的数据,所以可以在页面加载完毕,自动触发一下点击事件
Javanx
2019/09/04
1.4K0
第77天:jQuery事件绑定触发
返回值不同,.height()方法返回的是 数字类型(20),.css(“height”)返回的是字符串类型(20px),因此.height()方法常用在参与数学计算的时候
半指温柔乐
2018/09/11
1.3K0
解决JQuery中的ready函数冲突
jQuery确实是一个提高前端开发效率的好框架(虽然很多大牛们都说它效率不咋地),但是用好它有时候并不容易,也许你也遇到过以下情况: 一个aspx页面通常可以包含其它ascx控件,如果在多人协同开发的情况下:程序员小张在控件A.ascx中使用了 $().ready(function{}),而程序员小王又在控件B.ascx中也使用了ready函数,程序员小李在做页面时,把A.ascx,B.ascx都拖到自己的页面中,然后在页面中也需要用到$().ready函数,这下好了: 虽然jQuery本身的设计还算不错,
菩提树下的杨过
2018/01/22
1.6K0

相似问题

lightbox和jquery冲突

11

LightBox与jQuery冲突

21

JQuery与lightbox冲突

22

nivo滑块和lightbox冲突jquery

20

JQuery2.1.1& Lightbox冲突

23
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文