php - 在 Jquery slider 中使用 PHP 选项

标签 php jquery wordpress responsive-design

所以我不确定我是否遗漏了一些明显的东西。 (我认为这可能与两种语言的不兼容有关,因为据我所知,PHP 是在服务器上解释的?)……不过我对 PHP 还很陌生。

我在基于 WordPress 的自定义站点的首页上使用了很棒的 Jquery 插件 ResponsiveSlides。使用此代码效果很好:

$(".home-slides").responsiveSlides({
auto: true,
speed: 500,
pause: true,
timeout: 7000,
pager: true,
nav: true,
maxwidth: 1280,
namespace: "home-slides",
prevText: "",
nextText: "",
navContainer:".home-slides",
manualControls: "#home-tabs"
});

但是,我希望能够允许客户端对插件进行一些控制,使用 wordpress 后端主页上的自定义字段。这些自定义字段可以轻松调用并正确显示在警报中:

var speed = <?php echo the_field( "speed" ); ?>;
var timeout = <?php echo the_field( "timeout" ); ?>;

但是,如果我尝试将它们作为变量插入或直接使用上述 PHP,我就没有运气了。我得到的最接近的是:

$(".home-slides").responsiveSlides({
auto: true,
speed: <?php echo the_field( "speed" ); ?>,
pause: true,
timeout: <?php echo the_field( "timeout" ); ?>,
pager: true,
nav: true,
maxwidth: 1280,
namespace: "home-slides",
prevText: "",
nextText: "",
navContainer:".home-slides",
manualControls: "#home-tabs"
});

它在实时页面源中正确显示(即 timeout: 7000 等),但会破坏 slider 。有没有办法使这项工作?我错过了什么吗?

谢谢大家!

编辑:

感谢 Tom Kriek 的建议,我可以正确地回应脚本。这会在实时页面源代码中生成正确的脚本,但 slider 仍然不起作用。但是,如果我将相同的脚本从页面源复制到实际文件并进行测试,它会完美运行。出于某种原因,当 PHP 回显时,浏览器似乎忽略了脚本。

最佳答案

echo '<script type="text/javascript">
    $(".home-slides").responsiveSlides({
    auto: true,
    speed: '. the_field("speed") .',
    pause: true,
    timeout: '. the_field("timeout") .',
    pager: true,
    nav: true,
    maxwidth: 1280,
    namespace: "home-slides",
    prevText: "",
    nextText: "",
    navContainer:".home-slides",
    manualControls: "#home-tabs"
});
</script>';

关于php - 在 Jquery slider 中使用 PHP 选项,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25527828/

相关文章:

php - 如何使用 php xpath 获取节点的所有子节点?

jquery - 如何阻止导航选项卡在移动 View 中打开导航栏?

php - 令人惊叹的减慢页面加载时间

html - 换行后悬挂对齐/缩进<br>?

mysql - 如何将文章导入wordpress?

php - 位于 ./foo/bar/utility/baz.php 的 Foo\Bar\Baz 类不符合 psr-4 自动加载标准。跳绳

php - PHP 中的匿名函数内容不起作用

PhpStorm phpspec 代码嗅探器忽略测试文件夹

asp.net - SimpleModal 破坏了 ASP.Net 回发

php - jQuery.post() 如何处理 Content-Disposition : attachment?