从选择框中选择文章并显示其特色图像

Question

我有一个帖子选择框，并希望在从选择框中选择帖子时显示帖子的特色图像。像这样从选择框中选择文章，并在下面显示该文章的特色图像。

http://prntscr.com/d5e3ad自定义js文件代码

var $ = jQuery;
$(document).ready(function(){
$("post-thumb").css("display", "none");
$("#vzxms-post-slct").on('change', function(e){
    e.preventDefault();
    $slct_val = $("#vzxms-post-slct").val();
    console.log($slct_val);
    $.ajax({
        url: ajaxurl,
        data: $slct_val,
        success: function(data){
            $("#post-thumb").css("display", "block");
        }
    });
});
});

和插件索引文件，格式在div换行

<form method="post" action="">
            <div class="form-group-field">
                <div class="left_label"><label>
                    Select Post
                </label></div>
                <div class="rigth_input">
                    <select id="vzxms-post-slct" name="vzxms-post-slct" class="vzxms-post-slct">
                        <option selected="selected"> Select Post </option>
                        <?php
                        $args = array( 'post_type'=>'post');
                        $myposts = get_posts( $args );
                        foreach ( $myposts as $post ) : setup_postdata( $post ); ?>
                            <option value="<?php the_ID();?>"><?php the_title(); ?></option>
                        <?php endforeach; 
                        wp_reset_postdata();?>
                    </select>
  <!-- and here i want to show image -->
                    <?php 
                    $thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post_id), 'post'); 
                    ?>
                    <img src="<?php echo $thumb[0]; ?>" id="post-thumb"/>
                </div>
            </div>
        </form>

Answer 1

在选择框选项中，您可以遍历所有帖子的标题，如下所示:

  <select >
    <?php
    $args = array( 'post_type'=>'post');
    $myposts = get_posts( $args );
    foreach ( $myposts as $post ) : setup_postdata( $post ); ?>
        <option value="<?php the_ID();?>"><?php the_title(); ?></option>
    <?php endforeach; 
    wp_reset_postdata();?>
    </select>

在select选项更改时调用ajax从post id

获取post缩略图

$thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post_id), 'post'); 
//thumbnail link
echo $thumb[0];