Question

任何人都可以帮我关闭某些图片上的FancyBox吗？我在这里尝试了一百万种不同的选择，但没有取得多大进展。我正在处理的图片在WowSlider横幅中：http://www.freemanfoxx.com。问题，正如您将看到的那样，某些图像没有href位置，当它们被点击时，花式框正在加载错误页面。如果我们可以动态地更改类或者做其他事情来阻止fancybox加载那将是一个奇迹。

谢谢!!!!

图像是通过PHP动态加载的：

if (empty($descr)){
echo "<a href='#'>";}

else {
echo "<a rel=group1 href=";
    echo $descr;
    echo " target=_blank>"; }
?><img src="<?php echo $wpimage[0]; ?>" width="<?php echo $wpimage[1]; ?>" height="<?php echo $wpimage[2]; ?>" alt="" title="" id="wows<?php echo $image->ID; ?>">
<?php
if (empty($descr)){
echo "</a>";}

else {
echo "</a>";}

FancyBox加载基于：

    $("a.wow-fancy").fancybox({
    'hideOnContentClick': true,
    'width': 895,
    'height': 600,
    'type': 'iframe'
});

“cs-wowslider-images-new”类通过javascript通过此文件添加到图像中：http://freemanfoxxrealty.com/wp-content/themes/freemanfoxx/js/2wows-squares.js

更新

我想我可以通过动态删除一个类来实现这一点，但它似乎没有工作......任何想法？

    if(("a.wow-fancy").attr('href') = "#"){
    $(this).removeClass("wow-fancy");
    alert('hi');
}

Answer 1

如果您能够编辑html，您可以随时为不想使用fancybox的图像添加一个类名，并使用选择器：

    $("a.cs-wowslider-images-new:not('.noFancyBoxOnThisClassName')").fancybox({
    'hideOnContentClick': true,
    'width': 895,
    'height': 600,
    'type': 'iframe'
});

<小时/> 已编辑以回应OP的问题编辑。

要测试href是否只是'#'，如果是，请删除wow-fancy类：

$('a.wow-fancy').each(
    function(){
        if (this.href == '#') {
            $(this).removeClass('wow-fancy');
        }
    });

Answer 2

一个选项是：

如果href为空（如果适合您），则将PHP更改为不包括$descr标记。然后：

$('a[href].cs-wowslider-images-new').fancybox({...

这样的排序： http://jsfiddle.net/q9Tpd/

Answer 3

在我的情况下：

GET /book/{id}/author

只需添加GET /book/{id}/title，然后将$('.content img') .not('[hidden]') .not('.group-picture img, .post-gallery img') .not('.no-fancybox') .each(function () { var $image = $(this); var imageTitle = $image.attr('title'); var $imageWrapLink = $image.parent('a'); if ($imageWrapLink.size() < 1) { var imageLink = ($image.attr('data-original')) ? this.getAttribute('data-original') : this.getAttribute('src'); $imageWrapLink = $image.wrap('<a href="' + imageLink + '"></a>').parent('a'); } $imageWrapLink.addClass('fancybox fancybox.image'); $imageWrapLink.attr('rel', 'group'); if (imageTitle) { $imageWrapLink.append('<p class="image-caption">' + imageTitle + '</p>'); //make sure img title tag will show correctly in fancybox $imageWrapLink.attr('title', imageTitle); } }); $('.fancybox').fancybox({ helpers: { overlay: { locked: false } } });类添加到您不需要fancybox的.not('.no-fancybox')标记即可。

实际上，这段代码来自Hexo博客主题NexT（no-fancybox）

如何在某些图像上关闭FancyBox

更新

3 个答案: