Essential Grid / Wordpress API / Javascript图像

时间:2016-11-06 16:48:39

标签: javascript jquery wordpress

对于javascript / jquery pro来说这应该很容易。我试图抓取一个图像变量并使用javascript / jquery将其输出为html。我可以为带有文本的变量做这件事,但我似乎无法抓住图片网址。我认为变量存储为数组/对象?

感谢您的帮助。是的,我搜索了2天并浏览了所有文档。我认为问题是myjavascript / jquery技能。

基本上,我需要var urlClass =' .eg-investment-element-26&#39 ;;输出为网址。 `



/* Title Class from Skin Editor */
var titleClass = '.eg-investment-element-3';
var typeClass = '.eg-investment-element-16';
var executiveClass = '.eg-investment-element-19';
var urlClass = '.eg-investment-element-26';

 
/* Lightbox title container */
var titleWrap  = jQuery('<h2 class="lb-title-content" />');

/* Lightbox type container */
var typeWrap  = jQuery('<span class="type" />');
 
/* Lightbox executive container */
var executiveWrap  = jQuery('<span class="executive" />');

/* Lightbox link container */
var urlWrap  = jQuery('<span class="executive" />');

/* Left block container */
var leftBlock  = jQuery('<div class="lb-content lb-content-left" />');
 
/* Right block container */
var rightBlock = jQuery('<div class="lb-content lb-content-right" />');

/* Right block container header*/
var rightBlockheader = jQuery('<div class="right-header" />');

/* Right block container header 1*/
var rightBlockheadercol1 = jQuery('<div class="right-header1" />');

/* Right block container header 2*/
var rightBlockheadercol2 = jQuery('<div class="right-header2" />');

/* Right block container header 3 */
var rightBlockheadercol3 = jQuery('<div class="right-header3" />');
 
var myAjaxContainer;

console.log(titleWrap)
 
window.myAjaxLoaded = function(data) {
 
    if(!myAjaxContainer) {
 
        myAjaxContainer =  jQuery(data.containerid).esgbox({
 
            maxWidth    : 760,
            maxHeight   : 540,
            fitToView   : false,
            width       : '70%',
            height      : '70%',
            padding     : [30,30,30,30],
            autoSize    : false,
            closeClick  : false,
            openEffect  : 'fade',
            closeEffect : 'fade'
 
        });
 
    }
 
    var content = jQuery('.eg-ajax-target'),
    post = jQuery('.eg-post-' + data.postsource).closest('.tp-esg-item');
 
    titleWrap.text(post.find(titleClass).text());
    typeWrap.text(post.find(typeClass).text());
    executiveWrap.text(post.find(executiveClass).text());
     urlWrap.attr(post.find(urlClass).html());


    leftBlock.html('<img src="' + urlWrap + '" />');
 

    rightBlock.html(content.html()).prepend(titleWrap).prepend(executiveWrap).prepend('<img src="' + post.find('.esg-entry-media img').attr('src') + '" />').prepend(typeWrap).prepend('<img src="' + (urlWrap) + '" />');
    content.html('').append([leftBlock, rightBlock]);
 
    myAjaxContainer.click();


 
};
&#13;
&#13;
&#13;

` enter image description here

1 个答案:

答案 0 :(得分:0)

要使用jQuery输出html,只需使用html()方法。 如果我得到你的要求你需要输出html到容器。

var yourImgSrc = "someUrl";
var imgHtml = "<img src="+ yourImgSrc +"/>";
//select any container (div,body,#Id, .class) and inject the image html into it
$('yourSelector').html(imgHtml);

希望有所帮助