Javascript 元素不起作用答案

【问题标题】：Javascript element doesn't workJavascript 元素不起作用
【发布时间】：2014-11-18 23:25:29
【问题描述】：

我正在开发一个关于 Wordpress 的网页，我想插入一个滑块，其中包含来自 6 个博客的帖子。这些帖子将由我选择，因为我为此使用了高级自定义字段插件。 php 部分工作正常，但我没有让 js 工作。这是我的html代码：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="jquery.flexslider.js"></script>
<script>
$(window).load(function() {
    $(".flexslider").flexslider({
        animation: "slide",
    });
 });
</script>

这是滑块的 html：

<div id="grey" class="row main-post">
<div class="flexslider">
  <ul class="slides">
    <?php
    echo get_chosen_post();
    echo get_chosen_post_1();
    echo get_chosen_post_2();
    ?>
  </ul>
  </div>
</div>

以及从字段中检索帖子的功能之一：

  function get_chosen_post() {
    global $wpdb;
    $post_title = get_field('post_title');
    $blog = get_field('blog_number');
    switch_to_blog( $blog );
    $posts = $wpdb->get_results("SELECT * FROM {$wpdb->prefix}posts WHERE post_type='post' AND post_status='publish' AND post_title LIKE '$post_title' LIMIT 1");
    foreach($posts as $post) {
        //Thumbnail
            $thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'large' );
            $url = $thumb['0'];
        $html .= '<div class="col-xs-12 col-sm-6 col-lg-4 mainpost "><div class="main-center"><a class="img-wrapper" href="'.get_permalink( $post->ID ).'"><img class="main-post-img" src="'.$url.'"></img></a></div></div>';

        $html .= '<div class="col-xs-12 col-sm-6 col-lg-4 mainpost no-padding"><div class="main-center mobile-text-fix">';
        //Title
        $html .= '<h4><a href="'.get_permalink($post->ID).'" title="'.$post->post_title.'">'.$post->post_title.'</a></h4>';
        //Excerpt
        $html .= '<p>'.$post->post_excerpt.'</p>';
        $html .= '</div></div>';

    }
switch_to_blog(1);
return $html;
}

查询工作正常，如果帖子标题包含引号，我使用 LIKE 语句来避免错误。我的滑块不起作用，它只显示我选择的所有帖子及其链接，但没有滑块。非常感谢您的帮助，谢谢！

【问题讨论】：

标签： javascript php jquery wordpress slider

【解决方案1】：

我认为滑块不起作用，因为在 html 结果中没有 LI 元素，而只有 DIV。你可以试试

  <ul class="slides">
    <li>  <?php   echo get_chosen_post(); ?></li>
    <li> <?php   echo get_chosen_post_1(); ?></li>
    <li> <?php echo get_chosen_post_2(); ?></li>
  </ul>

或

foreach($posts as $post) {
    $thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'large' );
    $url = $thumb['0'];
    $html .= '<li>';
    $html .= '<div class="col-xs-12 col-sm-6 col-lg-4 mainpost "><div class="main-center"><a class="img-wrapper" href="'.get_permalink( $post->ID ).'"><img class="main-post-img" src="'.$url.'"></img></a></div></div>';

    $html .= '<div class="col-xs-12 col-sm-6 col-lg-4 mainpost no-padding"><div class="main-center mobile-text-fix">';
    //Title
    $html .= '<h4><a href="'.get_permalink($post->ID).'" title="'.$post->post_title.'">'.$post->post_title.'</a></h4>';
    //Excerpt
    $html .= '<p>'.$post->post_excerpt.'</p>';
    $html .= '</div></div>';
    $html .= '</li>';
}

希望对你有帮助

【讨论】：