我正在Wordpress上的产品库中添加fancybox。我使用产品标题作为隐藏div的id名称和缩略图链接的href。产品标题中有空格,这打破了幻想。
我在网上找到的解决方案只涉及html元素之间的空白,我的javascript/regex知识不足以从中导出解决方案。
以下是我用来生成产品缩略图和图像的代码:
<div class="entry-post-thumbnail">
<a class="size-<?php echo $image_size;?> fancybox" href="#image-<?php the_title(); ?>"><?php the_post_thumbnail($image_size); ?></a>
<div id="image-<?php the_title(); ?>" style="display: none;">
<?php the_post_thumbnail($post->ID,'full'); ?>
</div>
</div><!-- .entry-post-thumbnail -->
这是输出的代码:
<a class="size-product fancybox" href="#image-Product three">
<img src="[###]/wp-content/uploads/2013/06/product-thumbnail.png" class="attachment-product wp-post-image" alt="Product thumbnail" height="222" width="166"></a>
<div id="image-Product three" style="display: none;">
<img src="[###]/wp-content/uploads/2013/06/product-thumbnail.png" class="attachment- wp-post-image" alt="Product thumbnail" full="" height="222" width="166">
</div>
任何帮助都将不胜感激!
使用preg_replace
<div id="image-<?php preg_replace('/('s/', '', the_title()); ?>" style="display: none;">
一个更好的正则表达式是[^A-Za-z0-9'-_:.]
。这将根据html中ID属性的有效值是什么?匹配html ID的所有无效字符?。