Javascript 如何在Wordpress的Photosweep中取消隐藏图像标题

Javascript 如何在Wordpress的Photosweep中取消隐藏图像标题,javascript,jquery,html,wordpress,photoswipe,Javascript,Jquery,Html,Wordpress,Photoswipe,我在Wordpress主题中使用Photosweep Gallery,当我打开幻灯片时,图像标题不会出现 我正在尝试为Wordpress编写一个插件,它应该可以解决这个问题。据我所知(感谢上帝谷歌Chrome的Inspect Element功能!!!)我需要更改的div如下: <div class="ps-caption-content">&nbsp;</div> 但它不起作用。标题仍然是空的 我还尝试将jQuery代码嵌入到文档就绪函数中,如下所示: jQue

我在Wordpress主题中使用Photosweep Gallery,当我打开幻灯片时,图像标题不会出现

我正在尝试为Wordpress编写一个插件,它应该可以解决这个问题。据我所知(感谢上帝谷歌Chrome的Inspect Element功能!!!)我需要更改的div如下:

<div class="ps-caption-content">&nbsp;</div>
但它不起作用。标题仍然是空的

我还尝试将jQuery代码嵌入到文档就绪函数中,如下所示:

jQuery(document).ready(function($)   
{   
    $('div.ps-caption-content').html("blabla");    
});
它也不起作用


@维柯:我在代码里找到了一段代码。Photosweep-3.0.5.min.js:

(function(e,c,a){

 a.registerNamespace("Code.PhotoSwipe.Toolbar");
 var b=e.Code.PhotoSwipe;

 b.Toolbar.CssClasses={
      toolbar:"ps-toolbar",
      toolbarContent:"ps-toolbar-content",
      toolbarTop:"ps-toolbar-top",
      caption:"ps-caption",
      captionBottom:"ps-caption-bottom",
      captionContent:"ps-caption-content",   // This is where ps-caption-content is set!
      close:"ps-toolbar-close",
      play:"ps-toolbar-play",
      previous:"ps-toolbar-previous",
      previousDisabled:"ps-toolbar-previous-disabled",
      next:"ps-toolbar-next",
      nextDisabled:"ps-toolbar-next-disabled"};
  .....
  ......
我还在code.photosweep-3.0.5.min.js中找到了这段代码:

initialize:function(d,c){
var g;
this.settings=c;
this.cache=d;
this.isVisible=!1;
this.fadeOutHandler=this.onFadeOut.bind(this);
this.touchStartHandler=this.onTouchStart.bind(this);
this.touchMoveHandler=this.onTouchMove.bind(this);
this.clickHandler=this.onClick.bind(this);
g=b.Toolbar.CssClasses.toolbar;
this.settings.captionAndToolbarFlipPosition&&(g=g+" "+b.Toolbar.CssClasses.toolbarTop);
this.toolbarEl=a.DOM.createElement("div",{"class":g},this.settings.getToolbar());

a.DOM.setStyle(this.toolbarEl,{left:0,position:"absolute",overflow:"hidden",zIndex:this.settings.zIndex});
this.settings.target===e?a.DOM.appendToBody(this.toolbarEl):a.DOM.appendChild(this.toolbarEl,this.settings.target);

a.DOM.hide(this.toolbarEl);
this.closeEl=a.DOM.find("."+b.Toolbar.CssClasses.close,this.toolbarEl)[0];
this.settings.preventHide&&!a.isNothing(this.closeEl)&&a.DOM.hide(this.closeEl);
this.playEl=a.DOM.find("."+b.Toolbar.CssClasses.play,this.toolbarEl)[0];
this.settings.preventSlideshow&&!a.isNothing(this.playEl)&&a.DOM.hide(this.playEl);
this.nextEl=a.DOM.find("."+b.Toolbar.CssClasses.next,this.toolbarEl)[0];
this.previousEl=a.DOM.find("."+b.Toolbar.CssClasses.previous,this.toolbarEl)[0];
g=b.Toolbar.CssClasses.caption;this.settings.captionAndToolbarFlipPosition&&(g=g+" "+b.Toolbar.CssClasses.captionBottom);
this.captionEl=a.DOM.createElement("div",{"class":g},"");
a.DOM.setStyle(this.captionEl,{left:0,position:"absolute",overflow:"hidden",zIndex:this.settings.zIndex});
this.settings.target===e?a.DOM.appendToBody(this.captionEl):a.DOM.appendChild(this.captionEl,this.settings.target);
a.DOM.hide(this.captionEl);

this.captionContentEl=a.DOM.createElement("div",{"class":b.Toolbar.CssClasses.captionContent},"");    // This where captionContent is being set!!!

a.DOM.appendChild(this.captionContentEl,this.captionEl);
this.addEventHandlers()},
在上面的函数中,以下行似乎正在设置ps标题内容的值:

this.captionContentEl=a.DOM.createElement("div",{"class":b.Toolbar.CssClasses.captionContent},"");

那不是改变现状的地方

下面是一组输出DIV的实际代码

 this.captionContentEl = a.DOM.createElement("div", {
                "class": b.Toolbar.CssClasses.captionContent
            }, "");
下面是一堆扩展的源代码


现在,您只需找出代码中产生实际标题的位置,然后将标题变量字符串粘贴到该div中,您的工作就可以了。

您能给出包含图像div幻灯片的完整代码示例吗?通常是$('ps-caption-content').html('blablabla');将插入文本,但问题是您的文本是什么和在哪里。我还尝试了您的建议$('ps-caption-content').html('blablabla');但它仍然不起作用。标题区域保持为空。文本搜索在其中一个导入的js文件中搜索“ps标题内容”,上面的代码不起作用,因为它是在运行时页面加载事件中执行的,并且此项可能是在这段时间内或在我在custom_Photoswip_image_titles.js中尝试了以下代码之后从这些js文件中创建的:
jQuery(document).ready(函数($){($('div.ps-caption-content').html(“blablablablabla”);})仍然不起作用。@vico:我在代码中找到了一段代码。Photoswip-3.0.5.min.js:我如何使用JSFIDLE?HTML不见了,不是吗?它只是源代码扩展成了一种更容易阅读的格式。您的页面上哪里有实际标题内容的显示?只需尝试将内容放入“”(这就是您当前div为空的原因)您必须知道您想要的标题的来源,以便您可以通过elebyID找到它,然后将内容放入其中。例如,当您打开并向下滚动到“多媒体资料”部分,然后单击多媒体资料中的一幅图像(例如wpcasa-02)时,幻灯片将打开。幻灯片中的当前图像应在上方栏中显示标题。在GoogleChrome中,我可以检查上栏元素,它会打开屏幕。现在在Google Chrome中,我可以测试它,在div标签之间插入一些东西,并显示正确的标题。不幸的是,div没有id。我不知道HTML是在哪里生成的。可能在某个.php文件中,但我不知道如何找到这段代码。你能给我一个提示吗?看看代码(除非你的插件有这样的设置,否则添加这个额外的标题似乎需要大量的编码。我认为现在你最好尝试一个新的插件。或者看看这个插件的文档,如果有一些设置你可以使用的话。因为通过代码添加这个可能不是一个好的解决方案。
this.captionContentEl=a.DOM.createElement("div",{"class":b.Toolbar.CssClasses.captionContent},"");
 this.captionContentEl = a.DOM.createElement("div", {
                "class": b.Toolbar.CssClasses.captionContent
            }, "");