Показать divs в зависимости от количества массивов

Вот моя функция

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; } } } 

Solutions Collecting From Web of "Показать divs в зависимости от количества массивов"

пытаться:

 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; } 

Как вы изменили код, $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.