jQuery подсчитывает количество вложенных кнопок во вложенных и (изначально) скрытых DIV

jquery count nested

27 просмотра

2 ответа

У меня есть некоторый код PHP, генерирующий HTML, и в зависимости от некоторых условий в некоторых DIV, некоторые кнопки могут быть динамически созданы с использованием jQuery ( после загрузки документа ). DIV, которые могут содержать кнопки, имеют начальное скрытое состояние CSS.

В то время как содержащие DIVs скрыты, мне нужно:

  • Подсчитайте, сколько кнопок

  • Если есть только одна кнопка, вернуть идентификатор кнопки

HTML

<div id="row-buttons">
    <div> <!-- dynamically generated unknown id --> 
        <div id="classes-buttons-placeholder" style="display: none;">
            <!-- a DIV that may contain x buttons dynamically generated  -->
        </div>
        <div style="clear:both"></div>
        <div id="subjects-buttons-placeholder" style="display: none;">
            <div>
                <!-- another DIV that may contain x buttons dynamically generated  -->
                <button id="Music" class="subjects-button"> Music</button>
            </div>
        </div>
    </div>
</div>

В приведенном выше примере, как я могу проверить, есть ли только одна кнопка, и в этом случае вернуть идентификатор?

Автор: Riccardo Источник Размещён: 08.11.2019 11:17

Ответы (2)


1 плюс

Решение

Попробуйте этот код

$(function(){
    $("div[id*='-buttons-placeholder']:hidden").each(function(){
    var buttons = $(this).find("button");
    if(buttons.length == 1) {
        alert("Button inside " + $(this).attr("id") + ": " + buttons.attr("id"));
    }
  });
});

Дает вывод как Button inside subjects-buttons-placeholder: Music

JSFiddle: https://jsfiddle.net/vnathalye/bk4wbp6u/

Автор: Vivek Athalye Размещён: 20.08.2016 12:41

0 плюса

сначала itertate над каждым повторяемым div, а затем под div найти кнопку и вернуть id

$('.master-divs').each(function(){
    
  b = $(this).find('button');
  if(b.length>0){
  button_id= b.attr('id');
    alert(button_id);
    }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="row-buttons">
    <div> <!-- dynamically generated unknown id --> 
        <div id="classes-buttons-placeholder"  class="master-divs" style="display: none;">
            <!-- a DIV that may contain x buttons dynamically generated  -->
        </div>
        <div style="clear:both"></div>
        <div id="subjects-buttons-placeholder" class="master-divs" style="display: none;">
            <div>
                <!-- another DIV that may contain x buttons dynamically generated  -->
                <button id="Music" class="subjects-button"> Music</button>
            </div>
        </div>
    </div>
</div>

Автор: Vaimeo Размещён: 20.08.2016 12:42
Вопросы из категории :
32x32