问题描述
我想在wordpress循环内的某个元素上使用Bootstrap弹出窗口.我有一个javascript函数，理想情况下应该拉出该帖子的标题，将其存储在变量中并返回该变量...但是，php块存储为字符串.我在这里和其他地方已经看到许多线程，解决方案是将php块放入<?php ?>内，但这在这里不起作用.
I want to use Bootstrap pop-over on an element inside wordpress loop. I have a javascript function that should ideally pull the title of the post, store it in a variable and return the variable... but, php block is stored as a sting. I've seen many threads here and elsewhere where the solution is to put the php block inside the <?php ?> but that just doesn't work here.
弹出窗口显示:<?php echo the_title(); ?>
我的脚本执行得太早了吗?
Is my script executed too early?
我的.js文件中的代码被wp_enque_script()所包围:
My code in .js file which is enqued with wp_enque_script():
jQuery(document).ready(function($){
share = function() {
var title = "<?php echo the_title(); ?>";
return title;
}
$('.share').popover({
content: share(),
placement: 'bottom'
});
});
编辑
我按照答案之一的建议使用了wp_localize_script()，但是变量返回null
I used wp_localize_script() as suggested in one of the answers, but the variables return null
functins.php
wp_enqueue_script( 'scripts', get_template_directory_uri() . '/js/scripts.js', array(), '', true );
wp_localize_script('scripts', 'script_vars', array(
'title' => the_title(),
'url' => the_permalink()
)
);
scripts.js
jQuery(document).ready(function($){
share = function() {
var title = script_vars.title;
return title;
}
$('.share').popover({
content: share(),
placement: 'bottom'
});
});
另外，在每个页面上的<body>标记之后，回显the_title()和the_permalink()
Aditionally, the_title() and the_permalink() are echoed after the <body> tag on each page
推荐答案
您的代码存在一些问题，对于WordPress开发人员来说，这似乎是常见的小错误.让我们对其进行排序.
There are a few problems with your code, which seem to be common small mistakes with people new to WordPress dev. Lets get it sorted.
- 本地化脚本是执行此操作的正确方法.
- 您需要知道循环外可用的值，以及不在循环内时如何获取标题和永久链接.
- 如何使脚本入队有一些小问题.
我们将使用几个特定的功能
We're going to use a couple specific functions
-
get_the_title( $ID );，它将需要循环外的帖子ID并返回它以供PHP使用，而不是回显它.链接 -
get_peramlink( $ID )也可以在循环外部使用，并返回永久链接以在PHP中使用. 链接 - 我们将调整传递给队列脚本的参数，特别是
array()应该为array('jquery')，以显示其对脚本中使用的jQuery的依赖性，我们也将jquery入队，并雇用wp_register_script.
get_the_title( $ID );which will require the post ID outside of the loop and returns it for use in PHP rather than echo'ing it out.linkget_peramlink( $ID )which also works outside the loop, and returns the permalink for use in PHP. link- we'll adjust the arguments you're passing to enqueue scripts, specifically the
array()should bearray('jquery')to show its dependancy on jQuery, which you're using in your script, we'll enqueue jquery as well, and also employwp_register_script.
在您的 functions.php 文件
function do_scripts()
{
/* Get the ID of the current post */
global $post;
$ID = $post->ID;
/* register the script */
wp_register_script( 'custom', get_template_directory_uri() . '/js/scripts.js', array('jquery'), false, true );
$script_vars = array(
'title' => get_the_title( $ID ),
'url' => get_permalink( $ID )
);
/* actually enqueue jquery (that ships with WP) and your custom script */
wp_enqueue_script( 'jquery' );
wp_enqueue_script( 'custom' );
/* Localize the vairables */
wp_localize_script('custom', 'script_vars', $script_vars);
}
/* If we're not in the admin section call our function on the wp_enqueue_scripts hook */
if ( !is_admin() ) add_action( "wp_enqueue_scripts", "do_scripts", 10 );
这将通过创建一个全局javascript对象并在包含脚本之前输出它来起作用.
This will work by creating a global javascript object and outputting it before your script is included.
在您的 scripts.js 文件中，您可以访问此对象.
In your scripts.js file you'll have access to this object.
script_vars.title // will return the title
script_vars.url // will return the permalink
这篇关于在jQuery脚本中使用php代码-wp_localize_script()无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！