2

我要发布一个小提琴，因为它更容易解释。

http://jsfiddle.net/EhNKM/84/

$("#focus a").mouseenter(
    function(){
        this.style.color = '#cc0000';
        $('<p>content from post that the hovered-over link points to.</p>').replaceAll('#child p');
    }
);

如何访问该帖子内容的链接所引用的帖子信息？我想使用该信息将该帖子内容加载到另一个 div 中，但我只是不确定从哪里开始（我可以使用什么 WordPress PHP？JS？）。任何事情，即使是因为我愚蠢而对我大喊大叫，都会有所帮助！

为了澄清小提琴中发生了什么，

  1. 一旦用户将鼠标悬停在链接上（指向另一个帖子），子 div 就会加载链接到的帖子内容。
  2. 不要担心 .click() 事件。我确信解决上述问题将提供对此的见解。

谢谢！

编辑：我也相信我应该使用

this.getAttribute('href')

获取链接到的帖子，但我不确定我应该（或可以！）使用什么 wp 函数来获取该帖子的内容，一旦我有参考。

4

1 回答 1

2

你可以使用jQuery ajax，好吧，一步一步地按照我的指示来做。

1.在你的主题文件夹中创建一个文件夹js，假设你的主题文件夹是二十二，那么应该是

http://yourDomain.com/wp-content/themes/twentytwelve/js

2.在你的文件中创建一个文件js folder并命名myScript.js

3.在你的functions.php文件中添加

add_action('wp_enqueue_scripts','my_theme_scripts_function');
function my_theme_scripts_function() {
    wp_enqueue_script('myScriptHandler', get_stylesheet_directory_uri() . '/js/myScript.js');
    wp_localize_script( 'myScriptHandler', 'myAjax', array( 'ajaxUrl' => admin_url( 'admin-ajax.php' ) ) );
}

4.还在你的functions.php

function do_myAjaxFunction()
{
    $post_id = url_to_postid($_POST['post_url']);
    $post = get_post( $post_id, OBJECT);
    $response = apply_filters( 'the_content', $post->post_content );
    echo $response;
    die();
}
add_action( 'wp_ajax_nopriv_myAjaxHandler', 'do_myAjaxFunction' );  
add_action( 'wp_ajax_myAjaxHandler', 'do_myAjaxFunction' );

5.现在在myScript.js文件中，添加以下代码

$('.your_post-entry a').click(function(e){
    e.preventDefault();
    var currentUrl = $(this).attr('href');
    $.ajax({
        type : 'post',
        url : myAjax.ajaxUrl,  
        data: {
            action: 'myAjaxHandler',  
            post_url: currentUrl  
        },
        success: function(data){
            $('#ajax_post').html(data);
        }
    });
});

把上面的代码放在jQuery(function($){...});函数里面（jQuery 的 ready 事件）。完成了！现在您可以使用ajax.

解释 ：

当您单击带有类 name 的元素内的任何链接（假设是一个 div）时your_post-entry，click 事件将触发（您知道）并且它会发送一个 post 请求到，http://yourDomain.com/wp-admin/admin-ajax.php因为myAjax.ajaxUrl包含它url并且它（myAjax 对象）可供我们使用通过wp_localize_script我们在functions.php. 该ajax请求还将向$_POST数组发送一些变量，这些变量是actionand post_url，post_url包含permalink帖子的，admin-ajax.php并将运行我们的do_myAjaxFunction，它将获取帖子的内容并将其发送回浏览器，因为我们使用 添加了操作add_action( 'wp_ajax_myAjaxHandler', 'do_myAjaxFunction' )，这告诉WordPree每当您收到 ajax 操作请求时myAjaxHandler，请运行该功能do_myAjaxFunction。首先add_actionis wp_ajax_nopriv_myAjaxHandler，即使用户没有在 wordpress 后端登录，也需要使 ajax 请求工作，如果用户没有登录，则没有wp_ajax_nopriv_myAjaxHandlerajax 请求将不起作用。注意回调$('#ajax_post').html(data);中的行success，它会插入element/div使用of将数据返回到id中ajax_post，因此请确保在点击事件中使用适当的id和名称。class

例如，如果您不想为每个帖子使用，那么您可以为那些您想使用 ajaxajax的帖子添加/生成一个，例如，在点击事件中您可以使用classpost linksajaxPost

$('.your_post-entry a.ajaxPost').click(function(e){ ... });

现在你知道怎么做，所以我认为你可以使用mouseenter而不是click如果你需要这样做（你给出了一个 mouseenter 的例子）。

一些有用的链接： wp_ajax_和how-to-use-ajax-in-wordpress

于 2013-05-23T06:32:45.733 回答