Question

我有一个WordPress功能，可以覆盖原生的WordPress图库。我加了关于该函数的tooltipster.js，但我想获取data-image属性的值来获取url，然后将其放入工具提示器初始化中。

使用我的代码，工具提示有效，但它没有获取图像网址。

我有一个WordPress代码，位于functions.php中，如下所示：

<li> <a class="tooltip" data-image="<?php echo $attachment_img_url; ?>"> <?php echo wp_get_attachment_image( $attachment->ID, 'thumbnail' ); ?></a> </li>

和footer.php里面的工具提示器初始化：

$(document).ready(function() {
     var imgUrl = $(this).data('image');

     $('.tooltip').tooltipster({
       content: $('<span><img src="' + imgUrl + '" /></span>')
        });
});

Answer 1

根据tooltipster文档，您可以使用方法functionBefore在工具提示显示之前运行函数。此函数的第一个参数是origin或用于打开工具提示的元素。了解这一点后，您可以使用origin.data('image')获取data-image的数据，并使用origin.tooltipster('content', origin.data('image'));将其设置为工具提示的内容。

$('.tooltip').tooltipster({
    content: 'Loading...',
    functionBefore: function(origin, continueTooltip) {
        continueTooltip();
        origin.tooltipster('content', origin.data('image'));
    }
});

DEMO

如何从WordPress中的函数获取data属性的值并将其放在jquery中的变量中？

1 个答案: