【问题标题】:Select a post from select box and display its featured image从选择框中选择帖子并显示其特色图片
【发布时间】:2016-11-10 06:39:33
【问题描述】:

我有一个帖子选择框,想在从选择框中选择帖子时显示帖子的特色图片。像这样的东西 从选择框中选择帖子并在下方显示该帖子的特色图片。

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 wrap中的形式

<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>

【问题讨论】:

  • 是的,我还附上了一个截图链接。我怎样才能在后端做到这一点?我正在为管理端开发一个插件。

标签: wordpress wordpress-theming


【解决方案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>

在更改选择选项时进行 ajax 调用以从帖子 ID 中获取帖子缩略图

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

【讨论】:

  • 感谢 4 位帮助,但我只有 1 个页面用于处理选择框,并在该页面下方显示该帖子的图像。
  • 在同一页面上创建您的 ajax 函数,或将其添加到 functions.php 文件并通过 jquery @HeroWeb512 将返回缩略图链接附加到 img 标签
  • 我已经用代码更新了我的问题。请帮助我如何通过 ajax 将选定的帖子 ID 传递给 get_post_thumbnail_id($post_id)。
猜你喜欢
  • 2019-01-30
  • 2023-03-31
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-06-30
  • 1970-01-01
相关资源
最近更新 更多