Question

当用户将鼠标悬停在他们的个人资料照片上时，我正在使用jQuery captify库添加一个简单的“编辑个人资料照片”链接。显示为标题的文本是我想要在fancybox模式窗口中显示的链接。出于某种原因，captify阻止链接绑定到fancybox，并始终执行尝试加载页面的默认链接事件。这适用于页面上的任何链接，我通过添加$（'a'）来测试。单击（function（）{return false;}）; - 所以当你在调用captify之后尝试设置任何其他事件处理程序时，似乎有问题会导致问题。任何人都有任何可能导致这种情况的想法？或者，如果它与我正在使用的jquery版本（1.4.1）和captify ...不兼容...

这是html结构，其中div＃change_pic成为覆盖在图像顶部的标题：

<div id = "avatar"> 
 <img src="http://localhost/media/images/silhouette110x110.gif" alt="profile photo" class="captify" rel="change_pic" />    <div id="change_pic"> 
     <a href="http://localhost/image/manage" class="pic_manager">Change your photo</a>    </div> 
    </div>

Javascript看起来像这样：

 //jquery 1.4.1 already loaded
<script type="text/javascript" src="http://localhost/media/js/fancybox/jquery.fancybox-1.3.1.pack.js"></script> 
<script type="text/javascript" src="http://localhost/media/js/fancybox_init.js"></script> 
<link rel="stylesheet" type="text/css" href="http://localhost/media/css/captify.css" /> 
<script type="text/javascript" src="http://localhost/media/js/captify.tiny.js"></script> 
     <script type = "text/javascript"> 
            $(document).ready(function(){

             $('img.captify').captify({
              // caption span % of the image
              spanWidth: '90%'
             });

             $("a.pic_manager").fancybox();  
            });
        </script>

Answer 1

问题似乎与使用remove（）而不是detach（）有关，删除了之前附加到DOM元素的所有事件。

我修改了captify.js（v.1.1.3）

中的那些代码行

var captionLabelSrc = $('#' + $(this).attr('rel'));
var captionLabelHTML = !captionLabelSrc.length ? $(this).attr('alt') : captionLabelSrc.html();
captionLabelSrc.remove();

与

var captionLabelSrc = $('#' + $(this).attr('rel')).detach();
var captionLabelHTML = !captionLabelSrc.length ? $(this).attr('alt') : captionLabelSrc;
//captionLabelSrc.remove();

jQuery captify冲突其他jquery代码

1 个答案: