首先，您应该始终将php与javascript分开。一般来说，将它们混合在一起是一种不好的做法，特别是对于WordPress，它还迫使您以内联方式添加javascript，而不是使用WordPress的正确方式：使用wp_enqueue_script.当您需要将变量从PHP传递到javascript时，WordPress的正确方法是使用wp_localize_script.
因此，您的javascript代码应该如下所示：
jQuery(document).ready(function($){
var myMarkers = {"markers": [ my_map_data.markers ] };
$("#map").mapmarker({
zoom : 7,
center : \'Liverpool\',
markers : myMarkers
});
});
可读，不是吗？还要注意我是如何使用jQuery无冲突包装器的，这是因为我希望您正确地将jQuery排队（即使用
wp_enqueue_script 加载WP embedded jQuery版本），如果是，WordPress将在无冲突模式下使用jQuery，因此要使其正常工作，您应该使用
no confict wrappers.
现在您已经有了上面的代码，应该将其保存在一个文件中，并将其命名为my map。js并保存在您的主题（子）文件夹中（如果您正在开发插件，则保存在插件文件夹中）。
假设您将该文件保存在主题的“js”子文件夹中。现在，您必须包含在正确的模板中。我不知道你在哪里打印地图，我假设这里有一个页面模板，名为\'page-map.php\' 你想在那里包括你的地图，所以你必须在那里包括你的javascript。
在您的functions.php 您应该添加：
add_action(\'wp_enqueue_scripts\', \'add_map_scripts\');
function add_map_scripts() {
if ( is_page_template(\'page-map.php\') ) {
$jsurl = get_template_directory_uri() . \'/js/my-map.js\';
wp_enqueue_script(\'my-map\', $jsurl, array(\'jquery\') );
wp_localize_script(\'my-map\', \'my_map_data\', get_map_data() );
}
}
这是在WordPress中添加脚本的正确方法。如果你看起来像广告
wp_enqueue_script 我链接的文档，你可以看到我已经为函数添加了第三个参数，它是依赖项数组，无论你在数组中添加了什么脚本，如果还没有包含在页面中，都会被添加，之后还会包含你的脚本。我已经将jQuery包含在依赖关系数组中，这样我确信jQuery将被添加到页面中：如果您手动将jQuery添加到页面中。。。将其移除。你说你使用的插件有自己的js脚本，你应该看看这个脚本的句柄（它是
wp_enqueue_script) 并将其添加到依赖项数组中，这样您就可以确保您的脚本是在插件脚本之后添加的。
现在，如果您看到我发布的javascript代码，您会注意到标记数组取自my_map_data.markers 变量但是这个变量是在哪里定义的呢？
答案在wp_localize_script 我在上面的代码中调用了wp_enqueue_script. 如果您看到wp_localize_script 我在上面链接的文档中，您可以看到我正在向脚本传递一个对象，该脚本名为\'my_map_data\' 该对象的内容是get_map_data 作用这个函数还不存在，所以让我们编写它（应该在functions.php):
function get_map_data() {
// assure we are in right page
if ( ! is_page_template(\'page-map.php\' ) return;
$areas = new WP_Query( array(
\'post_type\' => \'area\', \'post_status\' => \'publish\', \'posts_per_page\' => -1,
\'orderby\' => \'date\', \'order\' => \'desc\'
) );
if ( ! $areas->have_posts() ) return; // no areas, nothing to do
$markers = array();
while ( $areas->have_posts() ) : $areas->the_post();
global $post; // current area post object
$deals_args = array(
\'post_type\' => \'deal\', \'post_status\' => \'publish\', \'numberposts\' => -1
\'post_parent\' => $post->post_parent
);
$d_num = count( get_posts($deals_args) );
$ballon_f = \'We have <span>%d</span> deals in <strong>%s</strong>\';
$ballon_f .= \'<br/><a href="%s">View deals</a>\';
$marker = array(
\'latidude\' => get_post_meta( get_the_ID(), \'_arealat\', true),
\'longitude\' => get_post_meta( get_the_ID(), \'_arealong\', true),
\'icon\': get_template_directory_uri() . \'/assets/img/design/logo-icon.png\',
\'baloon_text\' => sprintf($ballon_f, $d_num, get_the_title(), get_permalink() );
);
$markers[] = (object) $marker; // collect all markes in the $markes array
endwhile;
wp_reset_postdata(); // reset the post data after the custom query
// return the array of markes to wp_localize_script that will json_encode it and
// pass it to javascipt
return array( \'markers\' => $markers );
}
现在，我们的函数将数组返回到
wp_localize_script 该函数将此数组转换为JSON格式，并将其作为全局对象（名为“my\\u map\\u data”）传递给javascript。在javascript中使用
{"markers": [ my_map_data.markers ] };
它将包含由创建的对象数组
get_map_data 作用
