Question

我正在尝试构建一个WordPress插件，该插件将从鼠标悬停事件中的表中获取与帖子关联的数据，并将其附加到另一个div。我设法写了一些代码，零到不了解js和PHP。

我安装并激活了插件，但页面上没有加载js。我没有正确地将我的脚本排入队列吗？我还想实现以下目标：脚本只应加载到桌面上，因此不适用于移动设备。

任何正确方向的帮助或指示都会很棒！

我的PHP代码

<?php

/* PLUGIN INFO */

function sknv_ea_return(){

$ea_id = isset( $_POST['post_id'] ) ? $_POST['post_id'] : 0;

if ( $ea_id > 0)
{
    $ea_post = get_post($ea_id);
    ?>
    <div id="ea_post"><?php echo $ea_post->post_content; ?></div>
<?php
}
die();
}
add_action('wp_ajax_nopriv_sknv_ea','sknv_ea_return');

function sknv_ea_get_scripts()
{
wp_enqueue_script( plugins_url( 'sknv_ea.js', __FILE__ ));
}
add_action('wp_enqueue_scripts', 'sknv_ea_get_scripts');

?>

和我的JS代码

 jQuery(document).ready(function ($)  {
$("tr.emcustom").onmouseover( function() {
var div = $(this);

$.post('wp-admin/amdin-ajax.php' , {
    action: "sknv_ea",
    event_id: $(this).find("a").attr("id")
}, function (data) {
    $("#agenda_title").append($(data));
}
      );
return false;
});

$("tr.emcustom").mouseout( function() {
    $("ea_post").remove();
});
});

Answer 1

将您的脚本排入队列

问题是你没有正确使用wp_enqueue_script，但还有其他一些事情需要检查：

wp_enqueue_script的第一个参数是脚本的句柄，soruce文件实际上是第二个参数
您的js文件需要jQuery，因此您应该指定它作为依赖项以确保它在jQuery之后加载
确保您的.js文件位于插件根文件夹中，而不是在子文件夹中

更新sknv_ea_get_scripts功能，如下所示：

function sknv_ea_get_scripts(){
    wp_enqueue_script( "sknv_ea", plugins_url( 'sknv_ea.js', __FILE__ ), array( 'jquery' ));
}

注意：

“sknv_ea”是你脚本的句柄 - 你可以随意调用它，只要它的唯一性，以免与任何其他句柄冲突
第三个参数array( 'jquery' )是一个数组，其中包含脚本所依赖的所有脚本的句柄，并且必须在您的脚本之前加载。在这种情况下，我刚刚包含了jQuery，但如果你有任何其他依赖项，你应该将它们包含在数组中。另请注意，jQuery的默认句柄是jquery但是如果要加载自己的版本，请确保相应地更改句柄。

仅在桌面上加载

Wordpress提供了一项功能wp_is_mobile()（Codex Reference），用于检测访问者是否在移动设备上，因此您可以将呼叫包裹到wp_enqueue_script，例如

function sknv_ea_get_scripts(){
    if (!wp_is_mobile())
        wp_enqueue_script( "sknv_ea", plugins_url( 'sknv_ea.js', __FILE__ ), array( 'jquery' ));
}

但请注意，它可能不太可靠，因为它通过检查浏览器用户代理字符串来工作。另一个潜在问题是它将平板电脑视为移动设备。还有插件可用，如mobble，但我从来没有使用任何插件，所以我不推荐任何插件。

wordpress插件中

1 个答案: