Question

我在wordpress中有一个小部件列表。其中一个小部件是滑块。由于滑块需要ID和其他信息，我使用wp_localize_script将cdata数组解析到网站 - 每个滑块一个。所以在我的网站中，在页脚元素之后，我有以下代码（示例）

<script type='text/javascript'>
/* <![CDATA[ */
var sliderID = {"slider":"57d7b035941e9"};
var sliderID = {"slider":"57d7b03596340"};
/* ]]> */
</script>

每个数字都是一个php＆＃34; uniqid（）;＆＃34; -number来设置滑块的唯一ID。我也在加载一个＆＃34; sliderscripts.js＆＃34;如果滑块在当前站点中处于活动状态（在页脚中，但在CDATA下方），则为页脚。在sliderscripts.js中，我现在想要制作一个foreach ID滑块。使用ID不是问题，如

$(document).ready(function () {
    $('#'+sliderID.slider).owlCarousel({
... my options ...
});

现在的问题是：我怎么能用JS循环呢？如果是

<script type='text/javascript'>
/* <![CDATA[ */
var sliderID = {"slider":"57d7b035941e9","slider":"57d7b03596340"};
/* ]]> */
</script>

不会有问题。我需要使用var SliderID来预先处理CDATA。如果你帮助我会很棒的！

谢谢你！

Answer 1

即使@CBroe有一个好主意，从0开始也是太多的工作。对于有同样问题的其他人，这是我的解决方案：

<强> 1。生成ID

$sid = uniqid(); // sid = slider-ID - FE: 123

将为每个滑块生成唯一ID

<强> 2。生成密码

因为我被告知不要在函数中多次使用uniqid（它应该可以工作，但它似乎是一种糟糕的技术？）我使用wordpress hook generate password来生成类似ID的元素。

$ID2 = wp_generate_password(20, false, false); // generates an password / ID with 20 digits. FE: 12345678912345678911

第3。将ID和数据属性添加到代码

我现在打开像

这样的owlslider代码

<div id="slider_<?php echo $sid; ?>" class="owls" data-id2="<?php echo $ID2; ?>"

<强> 4。本地化脚本

现在我也在本地化这些值，所以我可以用JS

来获取它们

$slidersettings = array(
    'slider' => $sid,
    'url' => plugins_url(),
);
$sliderhandle = 'sl_'.$ID2; // will be sl_12345678912345678911

wp_localize_script( 'slider', $sliderhandle, $slidersettings );

<强> 5。构建滑块。

最后但并非最不重要的是，我将自定义脚本排入队列，我在其中检查ID以设置每个滑块

// check for all div's with the class "owls" AND id starts with "slider"
$('div.owls[id^="slider"]').each( function() { 
    var $div = $(this);
    var ID2 = $div.data('ID2'); // Now I grab the ID2 / 2nd ID out of the data-attribute


var cdata = window['sl_' + ID2]; // this now tells me in which CDATA Array I have to look for my values

$install= $( '#slider_' + cdata.slider); // slider_123 <- 123 = uniqid.

        $install.owlCarousel({
... standard owl stuff here...
})

就是这样。希望这会在某个时候帮助别人......一切顺利

如何在JS（Foreach）

1 个答案: