如果元框为空，使用自定义帖子类型隐藏 html

Question

我试图仅在元框已填充时显示#firstimg，否则它只会显示一个空框，因为它正在搜索不存在的图像。

我正在使用Custom Post Types，到目前为止我可以显示图像，但是一旦我尝试隐藏#firstimg，它所做的就是搞乱我的代码（它不会显示网站的其余部分，并且我的控制台日志中也没有任何内容，所以我不知道我做错了什么）。

我假设我可能很接近（希望如此？）但我没有正确编写代码。希望有人愿意帮助我！

  <img class="port-img" id="firstimg" src="
  <?php $key_1_value = get_post_meta($post->ID, 'ecpt_img_1', true); 
    if( ! empty( $key_1_value ) ) { 
    echo $key_1_value; 
    document.getElementById("firstimg").style.display = "block";}
  ?>">
  <img class="port-img" id="secondimg" src="<?php $key_2_value = get_post_meta($post->ID, 'ecpt_img_2', true); if( ! empty( $key_2_value ) ) { echo $key_2_value;}?>">
  <img class="port-img" id="thirdimg" src="<?php $key_3_value = get_post_meta($post->ID, 'ecpt_img_3', true); if( ! empty( $key_3_value ) ) { echo $key_3_value;}?>">

Answer 1

您没有转义或回显您的 JavaScript，这是导致网站无法加载超过该点的原因（您会遇到致命错误）。

如果密钥不存在，您为什么不完全阻止显示图像，如下所示：

$key_1_value = get_post_meta( $post->ID, 'ecpt_img_1', true );
$key_2_value = get_post_meta( $post->ID, 'ecpt_img_2', true );
$key_3_value = get_post_meta( $post->ID, 'ecpt_img_3', true );

if( $key_1_value ) echo '<img class="port-img" id="firstimage" src="'. $key_1_value .'" />';
if( $key_2_value ) echo '<img class="port-img" id="secondimage" src="'. $key_2_value .'" />';
if( $key_3_value ) echo '<img class="port-img" id="thirdimage" src="'. $key_3_value .'" />';

或者更好的是，您甚至可以将 1、2 和 3 作为数组循环（请注意，您必须将 CSS 从 #firstmage 更改为 #image-1 等 - 但它确实简化了事情。你也不需要定义key变量然后再检查，因为get_post_meta()会返回一个truthy值，如果不存在则false，所以你可以比较一下在你定义它的同时：

foreach( range(1,3) as $i ){
    if( $image_src = get_post_meta( $post->ID, "ecpt_img_$i", true ) ){
        echo "<img class='port-image' id='image-$i' src='$image_src' />";
    }
}

Answer 2

看起来你的 php.ini 中有 javascript。也许尝试这样的事情？我假设您的 css 在 .port-img 或 #firstimg 上没有 display: none...

<?php $key_1_value = get_post_meta($post->ID, 'ecpt_img_1', true); 
if( !empty( $key_1_value ) ) : ?>  
   <img class="port-img" id="firstimg" src="<?php echo $key_1_value; ?>"/>
<?php endif; ?>
<img class="port-img" id="secondimg" src="<?php $key_2_value = get_post_meta($post->ID, 'ecpt_img_2', true); if( ! empty( $key_2_value ) ) { echo $key_2_value;}?>">
<img class="port-img" id="thirdimg" src="<?php $key_3_value = get_post_meta($post->ID, 'ecpt_img_3', true); if( ! empty( $key_3_value ) ) { echo $key_3_value;}?>">