这是我的功能
function yyy_hero_image_option_callback() {
$hero_options = get_option( 'hero_options' );
$count=count($hero_options);
$totalimg=$count-4;
$html = '<div id="upload_yyy_sets">';
for($i=1;$i<=$totalimg;$i++){
if( isset( $hero_options['upload_yyy_link_1'] ) && $hero_options[ 'upload_yyy_link_1' ] ) {
$html .= '<div id="yyyclonedInput'.$i.'" class="yyyclonedInput">';
$html .= '<input id="cs_product_menu_yyy_src_'.$i.'" type="text" size="36" name="hero_options[upload_yyy_link_'.$i.']" value="' . $hero_options['upload_yyy_link_'.$i.''] . '" /> <input id="cs_product_menu_yyy_src_'.$i.'_yyybutton" type="button" value="Add / Change" class="button-secondary yyy-upload-button" /> <div class="button yyyremove">-</div>';
$html .= '</div>';
}
}
$html .= '</div>';
echo $html;
?> <div class="button yyyclone">Add an Image</div> <?php
}
除了一点jquery,这计算出数组的数量,将数字删除4,然后根据结果数显示div的数量。这一直很好,但现在我又添加了另一张幻灯片,需要以不同方式解决。
现在这是我的新功能
function yyy_hero_image_option_callback() {
$hero_options = get_option( 'hero_options' );
foreach($hero_options as $key => $value){
if (strpos($key, 'yyy')) {
var_dump($value);
}
}
}
这个新函数只是找到其中包含字符yyy的数组。
如何计算数组的数量,然后像以前一样显示它们?
由于
更新:这是我试图展示的图片
对于每个具有值zzz的数组,我希望它显示该数量的框,此图像将显示3个框,这意味着其中有3个包含zzz的数组。
这是数组
array(9) {
["show_hero_options"]=> string(1) "1"
["hero_height"]=> string(5) "600px"
["hero_width"]=> string(4) "100%"
["hero_buttons"]=> string(4) "show"
["upload_zzz_link_1"]=> string(105) "http://www.blahblah.com/image_link.jpg"
["upload_zzz_link_2"]=> string(79) "http://www.blahblah.com/image_link.jpg"
["upload_zzz_link_3"]=> string(79) "http://www.blahblah.com/image_link.jpg"
["upload_yyy_link_1"]=> string(79) "http://www.blahblah.com/image_link.jpg"
}
更新2a:
这里的查询只是
jQuery(document).ready(function($){
// Hero Image zzz upload
function zzz_updateClonedInput(index, element,param) {
$(element).appendTo("#upload_zzz_sets").attr("id", "zzzclonedInput" + index);
$(element).find(">:first-child").attr("id", "cs_product_menu_zzz_src_" + index);
$(element).find(">:first-child").attr("name", "hero_options[upload_zzz_link_" + index + "]");
if(param)
$(element).find(">:first-child").attr("value", "");
$(element).find(">:first-child").next().attr("id", "cs_product_menu_zzz_src_" + index + "_zzzbutton");
}
$(document).on("click", ".zzzclone", function(e){
e.preventDefault();
var zzztoappend='<div id="zzzclonedInput1" class="zzzclonedInput"><input id="cs_product_menu_zzz_src_1" type="text" size="36" name="hero_options[upload_zzz_link_1]" value="" /><input id="cs_product_menu_zzz_src_1_zzzbutton" type="button" value="Add / Change" class="button-secondary zzz-upload-button" /><div class="button zzzremove">-</div>'
if( $(".zzzclonedInput").length < 1){
// create div
$('#upload_zzz_sets').append(zzztoappend);
}
else {
// clone div
var zzzcloneIndex = $(".zzzclonedInput").length + 1;
var zzznew_Input = $(this).closest('.zzzclonedInput').length ? $(this).closest('.zzzclonedInput').clone() : $(".zzzclonedInput:last").clone();
zzz_updateClonedInput(zzzcloneIndex, zzznew_Input,true);
}
});
$(document).on("click", ".zzzremove", function(e){
e.preventDefault();
$(this).parents(".zzzclonedInput").remove();
$(".zzzclonedInput").each( function (zzzcloneIndex, zzzclonedElement) {
zzz_updateClonedInput(zzzcloneIndex + 1, zzzclonedElement,false);
})
});
jQuery(document).ready(function($){
$(document).on("click", ".zzz-upload-button", function(e){
e.preventDefault();
upload_image($(this));
return false;
});
});
function upload_image(el){
var $ = jQuery;
var custom_uploader;
var button = $(el);
var id = button.attr('id').replace('_zzzbutton', '');
if (custom_uploader) {
custom_uploader.open();
return;
}
//Extend the wp.media object
custom_uploader = wp.media.frames.file_frame = wp.media({
title: 'Add Image',
button: { text: 'Add Image' },
multiple: false
});
//When a file is selected, grab the URL and set it as the text field's value
custom_uploader.on('select', function() {
attachment = custom_uploader.state().get('selection').first().toJSON();
$('#'+id).val(attachment.url);
$('#'+id).prev().attr('src', attachment.url);
//console.log(attachment);
console.log(id);
//custom_uploader.close();
});
//Open the uploader dialog
custom_uploader.open();
}
});
更新2b:
我还设法显示了适量的字段,它只是没有添加值。这是我的新代码
function tl_hero_image_option_callback() {
$hero_options = get_option( 'hero_options' );
foreach ($hero_options as $key => $value) {
if (strpos($key, '_zzz_')) {
$html = '<div id="upload_zzz_sets">';
if( isset( $hero_options['upload_zzz_link_1'] ) && $hero_options[ 'upload_zzz_link_1' ] ) {
$html .= '<div id="zzzclonedInput'.$i.'" class="zzzclonedInput">';
$html .= '<input id="cs_product_menu_zzz_src_'.$i.'" type="text" size="36" name="hero_options[upload_zzz_link_'.$i.']" value="' . $hero_options['upload_zzz_link_'.$i.''] . '" /> <input id="cs_product_menu_zzz_src_'.$i.'_zzzbutton" type="button" value="Add / Change" class="button-secondary zzz-upload-button" /> <div class="button zzzremove">-</div>';
$html .= '</div>';
}
$html .= '</div>';
echo $html;
}
}
}
答案 0 :(得分:1)
尝试:
function yyy_hero_image_option_callback() {
$hero_options = get_option( 'hero_options' );
$i=1;
$html = '<div id="upload_zzz_sets">';
foreach($hero_options as $key => $values){
if (strpos($key, 'zzz')) {
$html .= '<div id="zzzclonedInput'.$i.'" class="zzzclonedInput">';
$html .= '<input id="cs_product_menu_zzz_src_'.$i.'" type="text" size="36" name="hero_options[upload_zzz_link_'.$i.']" value="' . $values . '" /> <input id="cs_product_menu_zzz_src_'.$i.'_zzzbutton" type="button" value="Add / Change" class="button-secondary zzz-upload-button" /> <div class="button zzzremove">-</div>';
$html .= '</div>';
$i++;
}
}
$html .= '</div><div class="button zzzclone">Add an Image</div>';
echo $html;
}
答案 1 :(得分:0)
您更改代码的方式,$i
不再设置,请尝试以下操作:
foreach ($hero_options as $key => $value) {
if (strpos($key, '_zzz_')) {
$i = substr($key, -1); // This will retrieve the last char of $key, which is corresponding to your previous $i
$html = '<div id="upload_zzz_sets">';
$html .= '<div id="zzzclonedInput'.$i.'" class="zzzclonedInput">';
$html .= '<input id="cs_product_menu_zzz_src_'.$i.'" type="text" size="36" name="' . $value . '" value="' . $value . '" /> <input id="cs_product_menu_zzz_src_'.$i.'_zzzbutton" type="button" value="Add / Change" class="button-secondary zzz-upload-button" /> <div class="button zzzremove">-</div>';
$html .= '</div>';
$html .= '</div>';
echo $html;
}
}
我还将$hero_options[key]
部分替换为$value
部分,因为您已经从foreach获得了它。