Jquery for Wordpress 在我的本地主机上工作，但在上传文件后它停止工作？

Question

我在本地主机的 Wordpress 页面中安装了 Jquery for Wordpress：

http://localhost/brianfunshine.com2/

图像在灯箱中正确显示

http://alex-chen.net/wordpress/

但是当我将文件上传到服务器时，Jquery for Wordpress 停止工作。

我刚刚上传了 Wordpress 主题和插件。

我不确定要提供哪个代码。

请告诉我如何解决这个问题。

图片的链接代码（本例为视频）：

<div><a href="#second2"><img src="http://www.howieolson.com/wp-content/uploads/2010/04/howie-olsen-welcome-video.jpg" alt="Welcome To High Output" width="220px" height="120px" /></a></div>
<div id="second2" style="display: none;"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="480" height="385" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="allowFullScreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="src" value="http://www.youtube.com/v/N172nW_U39g?fs=1&amp;hl=en_US" /><param name="allowfullscreen" value="true" /><embed type="application/x-shockwave-flash" width="480" height="385" src="http://www.youtube.com/v/N172nW_U39g?fs=1&amp;hl=en_US" allowscriptaccess="always" allowfullscreen="true"></embed></object></div>

编辑：

插件说它自己寻找直接链接。当我从本地主机使用它时它确实如此。

当我上传文件时，我必须将 class: "fancybox" 分配给链接以使其正常工作。

我不懂 Javascript，但我认为插件会在这里搜索直接链接：

// Load FancyBox with the settings set
function mfbfw_init() {

    $settings = mfbfw_get_settings();

    echo "\n"."\n"."<!-- Fancybox for WordPress v". $settings['version'] ." -->"."\n";

    ?>

<script type="text/javascript">

    <?php if ($settings['jQnoConflict']) { ?>jQuery.noConflict();<?php } echo "\n" ?>

    jQuery(function(){

        <?php // This copies the title of every IMG tag and adds it to its parent A so that fancybox can use it ?>
        jQuery.fn.getTitle = function() {
            var arr = jQuery("a.fancybox");
            jQuery.each(arr, function() {
                var title = jQuery(this).children("img").attr("title");
                jQuery(this).attr('title',title);
            })
        }

        // Supported file extensions
        var thumbnails = 'a:has(img)[href$=".bmp"],a:has(img)[href$=".gif"],a:has(img)[href$=".jpg"],a:has(img)[href$=".jpeg"],a:has(img)[href$=".png"],a:has(img)[href$=".BMP"],a:has(img)[href$=".GIF"],a:has(img)[href$=".JPG"],a:has(img)[href$=".JPEG"],a:has(img)[href$=".PNG"]';

    <?php if ($settings['galleryType'] == 'post') {

        // Gallery type BY POST and we are on post or page (so only one post or page is visible)
        if ( is_single() | is_page() ) { ?>

        jQuery(thumbnails).addClass("fancybox").attr("rel","fancybox").getTitle();

    <?php }

    // Gallery type BY POST, but we are neither on post or page, so we make a different rel attribute on each post
    // (optimized based on sugestions from http://mentalfruition.com/)
    else { ?>

        var posts = jQuery('.post');

        posts.each(function() {
            jQuery(this).find(thumbnails).addClass("fancybox").attr('rel','fancybox'+posts.index(this)).getTitle()
        });


    <?php }

    }

Answer 1

插件选择器使用 has(img) 来确定是否应该将 fancybox 类添加到链接中。

var thumbnails = 'a:has(img)[href$=".bmp"],a:has(img)[href$=".gif"],a:has(img)[href$=".jpg"],a:has(img)[href$=".jpeg"],a:has(img)[href$=".png"],a:has(img)[href$=".BMP"],a:has(img)[href$=".GIF"],a:has(img)[href$=".JPG"],a:has(img)[href$=".JPEG"],a:has(img)[href$=".PNG"]';


jQuery(thumbnails).addClass("fancybox").attr("rel","fancybox").getTitle();

<a href="http://img155.imageshack.us/img155/4065/screenshot2lx.png">click here</a>

它需要类似以下的东西才能自动工作：

<a href="http://img155.imageshack.us/img155/4065/screenshot2lx.png"><img src="<thumbnail url>" /></a>