我正在制作一个jquery滑块,底部有缩略图,我希望它们与相关视频相关联。我正在做的是我从管理员添加一个帖子,标题包含图像的标题,内容区域包含缩略图图像和视频链接我添加自定义字段。
再次进入滑块,如果我只对图像进行相同的处理(不是视频),它可以正常工作。我单击底部的缩略图,并在滑块中显示大图像。我正在获取我通过这行代码点击的图像来源
var url = $(this).attr("src");
它从img标签中获取了图像的来源。一切都好。但现在我的确切点是,我想通过上面的代码得到自定义字段值,但我不知道如何做到这一点,因为我从互联网上随机尝试了这么多方法,但没有什么工作对我好。
希望你们明白我的意思,如果不是的话,如果需要,我会提供更多的代码细节。
任何帮助都会得到很好的帮助。
这是我的完整代码(php和html)
</div>
<div class="video-gallery">
<a class="prev browse left"><<</a>
<div class="scrollable" id="scrollable">
<div class="items">
<?php if (have_posts()) : ?>
<?php
$thePosts = get_posts('numberposts=50&category=4');
foreach($thePosts as $post) :
setup_postdata($post);
$custom_field = get_post_meta($post->ID,'video path', true);
echo '<div class="myclass" style="display:none" id="'.$custom_field.'"></div>';
the_content();?>
<?php endforeach; ?>
<?php else : ?>
No Results
<?php endif; ?>
</div>
</div>
这是javascript jquery
<script type="text/javascript">
$(".video-gallery img").click(function() {
// see if same thumb is being clicked
if ($(this).hasClass("active")) { return; }
// calclulate large image's URL based on the thumbnail URL (flickr specific)
var url = $('.myclass').attr('id');
alert(url);
// get handle to element that wraps the image and make it semi-transparent
var wrap = $(".image_wrap").fadeTo("medium", 0.5);
// the large image from www.flickr.com
var img = new Image();
// call this function after it's loaded
img.onload = function() {
// make wrapper fully visible
wrap.fadeTo("fast", 1);
// change the image
wrap.find("iframe").attr("src", url);
};
// begin loading the image from www.flickr.com
img.src = url;
// activate item
$(".video-gallery img").removeClass("active");
$(this).addClass("active");
// when page loads simulate a "click" on the first image
});
</script>
答案 0 :(得分:2)
您需要使用get_post_meta()函数来检索所需的自定义字段,如下所示:
$custom_field = get_post_meta($post->ID,'CustomFieldName', true);
答案 1 :(得分:0)
您可以使用带有数据前缀的自定义属性,在检索每个缩略图时添加此项:
<img data-video="get_post_meta($post->ID,'video_ulr', true);" src="...">
你可以使用Jquery操纵这个“数据”。例如,要检索示例中的数据,请使用以下命令:
var url = $('this').data('video');
请查看jQuery documentation了解更多信息/示例。