Javascript in wordpress

时间:2013-02-28 作者:MidhuN

我在一个特定分区的页面中为同一类别的不同帖子显示了特色图片。我需要在另一个分区的同一页面中显示与此图片相关的整个帖子。我知道我必须在这方面使用JavaScript。但我需要一些参考,我可以用来做这件事。有人能帮我吗?我正在使用以下代码显示图像

<?php
/*
Template Name: Meet The Team Template
*/
?>
<?php get_header(); ?>
<div id="meet_posts" class="narrowcolumn">
<?php 
    $recent = new WP_Query("cat=6&orderby=title&order=ASC"); 
    while($recent->have_posts()):$recent->the_post();
    $desc_values = get_post_custom_values("description");

?>
<div id="meetteam_featured_image">
    <a href="<?php the_permalink() ?>" rel="title">
        <?php
            if ( has_post_thumbnail() ) 
            { 
                the_post_thumbnail();
            }
        ?>
    </a>
</div>
<?php endwhile ?>
</div>

<?php get_footer(); ?>
提前感谢

1 个回复
最合适的回答,由SO网友:Vinod Dalvi 整理而成

用以下代码替换上述代码:

<?php /*
Template Name: Meet The Team Template
*/
?>
<?php get_header(); ?>
<div id="meet_posts" class="narrowcolumn">
<?php 
$recent = new WP_Query("cat=6&orderby=title&order=ASC"); 
while($recent->have_posts()):$recent->the_post();
$desc_values = get_post_custom_values("description");

?>
<div id="meetteam_featured_image" class="<?php the_ID(); ?> team_featured_image_<?php the_ID(); ?>">
<a href="<?php the_permalink() ?>" rel="title">
  <?php
    if ( has_post_thumbnail() )  { 
            the_post_thumbnail();
        }
    ?>
</a>
</div>
<?php endwhile ?>
<div id="image-post-info"></div>
</div>

<?php get_footer(); ?>
在函数中添加以下代码。php文件:

add_action( \'wp_ajax_ajaxified_function\', \'ajaxified_function\' );
add_action( \'wp_ajax_nopriv_ajaxified_function\', \'ajaxified_function\' );
function ajaxified_function() {   
   $temp = get_post($_POST[\'post_id\']);
   echo $temp->post_title.\'<br/><br/>\'.$temp->post_content;   
   die();
}   
在自定义js文件中添加以下代码:

jQuery(document).ready(function (){       

 jQuery(\'#meetteam_featured_image a\').on(\'click\',function(event){         
 event.preventDefault();

 var post_id = jQuery(this).parent().attr(\'class\');            
 post_id = post_id.split(" ");
 post_id = post_id[0];
 jQuery.ajax({  
   type: "POST",                  
   url:  \'http://www.yoursitename.com/wp-admin/admin-ajax.php\',  
   data: \'action=ajaxified_function&post_id=\'+post_id,    
   success: function (msg) {                                        
      jQuery(\'#image-post-info\').html(msg);
   },
   error: function () {                  
      alert(\'Error\');                    
   }  
  });           
  });       
});
通过在函数中包含以下代码来添加自定义js文件。php文件:

function add_custom_scripts() {
wp_enqueue_script( \'custom-script\',  get_stylesheet_directory_uri() .\'/js/custom-scripts.js\' );
}
add_action( \'wp_enqueue_scripts\', \'add_custom_scripts\' );

结束

相关推荐

Wp-admin post.php JavaScript链接不起作用

我最近注意到,在我的后端管理面板中,没有任何动态JavaScript链接可以打开或工作。这包括“状态”、“可见性”和“计划”旁边的“编辑”链接。此外,slug permalink编辑按钮不会执行任何Ajax/JavaScript操作。单击任何链接只会附加hashtag值(例如。#edit_timestamp) 进入我的URL。但是,如果不使用JavaScript,似乎无法更新发布时间戳或发布URL。这是其他人遇到的常见问题吗?我已经尝试禁用我所有的插件,我只使用2-Akismet和Google XML网站