我有一个wordpress小部件列表。其中一个小部件是滑块。由于滑块需要ID和其他信息,我正在使用wp_localize_script解析cdata数组到网站-每个滑块一个。因此,在我的网站,在页脚元素之后,我有以下代码(示例)
<script type='text/javascript'>
/* <![CDATA[ */
var sliderID = {"slider":"57d7b035941e9"};
var sliderID = {"slider":"57d7b03596340"};
/* ]]> */
</script>
每个数字都是一个php "uniqid();-number为滑块设置唯一的ID。如果滑块在当前站点中处于活动状态(在页脚中,但在CDATA下面),我还将加载"sliderscripts.js"到页脚。在sliderscripts.js中,我现在想为每个ID创建一个滑动条。使用ID没有问题,比如
$(document).ready(function () {
$('#'+sliderID.slider).owlCarousel({
... my options ...
});
现在问题是:我怎么用JS来循环呢?如果是
<script type='text/javascript'>
/* <![CDATA[ */
var sliderID = {"slider":"57d7b035941e9","slider":"57d7b03596340"};
/* ]]> */
</script>
不会有问题的。我需要foreach CDATA与var SliderID做一些事情。如果你能帮我,那就太好了!
谢谢!
即使@CBroe有一个很好的想法,但从0开始做的工作太多了。对于其他有同样问题的人,这是我的解决方案:
1。生成ID
$sid = uniqid(); // sid = slider-ID - FE: 123
将为每个滑动条生成唯一的ID
2。生成密码
因为我被告知不要在一个函数中多次使用uniqid(它应该工作,但它似乎是一个糟糕的技术?)我正在使用wordpress钩子生成密码来生成一个id类似的元素。
$ID2 = wp_generate_password(20, false, false); // generates an password / ID with 20 digits. FE: 12345678912345678911
3。添加ID和data- attribute到代码
我现在打开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...
})
这它。希望这将帮助别人的某个时候....祝一切顺利