Question

请查看以下代码：

<ul id="all-movies">                    
  <li class="movie">
    <img src="pic.jpg" />
  </li>
  <li class="movie featured">
    <img src="pic.jpg" />
  </li>
  <li class="movie featured">
    <img src="pic.jpg" />
  </li>
</ul>

在上面的代码中，我想将<a href="<?php bloginfo('url'); ?>/hello"></a>添加到li元素中featured类，以便它看起来像这样：

<ul id="all-movies">                    
  <li class="movie">
    <img src="pic.jpg" />
  </li>
  <li class="movie featured">
    <a href="<?php bloginfo('url'); ?>/hello"></a>
    <img src="pic.jpg" />
  </li>
  <li class="movie featured">
    <a href="<?php bloginfo('url'); ?>/hello"></a>
    <img src="pic.jpg" />
  </li>
</ul>

<?php bloginfo('url'); ?>将替换为我的网站。

我怎样才能让它发挥作用？我尝试了类似下面的内容，但它不起作用：

$("#all-movies li").hasClass('featured').prepend('<a href="<?php bloginfo('url'); ?>/hello"></a>');

注意：动态添加featured类。

-edit-这是我用来动态添加featured类的代码：

function wpse80098_filter_post_class( $classes ) {
    global $post;
    if ( 'yes' == get_post_meta( $post->ID, '_jsFeaturedPost', true ) ) {
        $classes[] = 'featured';
    }
    return $classes;
}
add_filter( 'post_class', 'wpse80098_filter_post_class' );

Answer 1

hasClass返回一个没有prepend方法的布尔值，可以使用类选择器。

$("#all-movies li.featured").prepend('<a href="<?php bloginfo("url"); ?>/hello"></a>');

或：

$("#all-movies li").filter('.featured').prepend('<a href="<?php bloginfo("url"); ?>/hello"></a>');

Answer 2

<script>
$(document).ready(function(){
    var yourURL = "<?php bloginfo('url'); ?>/hello";
    $("#all-movies li.featured").prepend('<a href="'+yourURL+'"></a>');
});
</script>

Answer 3

您可以尝试使用.find()功能：

var url = "<?php bloginfo('url'); ?>/hello";
$('ul#all-movies').find('li.featured').prepend("<a href='"+url+"'></a>");

Answer 4

你试过了吗？

$("#all-movies li.featured").prepend('<a href="<?php bloginfo('url'); ?>/hello"></a>');

假设<?php ?>内容实际上是在您的服务器上处理的，并且没有进入客户端。

Answer 5

$('li.featured').each(function(){
   $(this).prepend('<a href="<?php bloginfo("url"); ?>/hello"></a>');
});

将动态“a”标记添加到具有特定类的“li”元素

5 个答案: