2015-04-06 3 views
0

У меня есть простой вопрос, где я должен повторять DOM с помощью JQuery (а не Javascript). Div с классом «questionBlock» может продолжаться и продолжаться. Как получить доступ ко всем значениям «класса», которые находятся внутри опции «Контейнер», и сохранить их в json.Итерационные узлы в jquery

<div class = "questionBlock"> 
    <div class = "title">title1</div> 
    <div class = "optionContainer"> 
     <div class = "row">1</div> 
     <div class = "row"> 2 </div> 
     <div class = "row"> 3 </div> 
     <div class = "row"> 4 </div> 
     <div class = "row"> 5 </div> 
     <div class = "row"> 6 </div> 
    </div> 
</div> 

<div class = "questionBlock"> 
    <div class = "title">title2</div> 
    <div class = "optionContainer"> 
     <div class = "row">7</div> 
     <div class = "row"> 8 </div> 
     <div class = "row"> 13 </div> 
     <div class = "row"> 24 </div> 
     <div class = "row"> 15 </div> 
     <div class = "row"> 16 </div> 
    </div> 
</div> 


<div class = "questionBlock"> 
    <div class = "title">title3</div> 
    <div class = "optionContainer"> 
     <div class = "row">41</div> 
     <div class = "row"> 42 </div> 
     <div class = "row"> 43 </div> 
     <div class = "row"> 44 </div> 
     <div class = "row"> 45 </div> 
     <div class = "row"> 46 </div> 
    </div> 
</div> 
+0

Хочет значение из всех «строк» ​​во всех 'optionContainer's или все«строк»в пределах конкретный 'optionContainer'? – DelightedD0D

+0

Вы не должны помещать пробелы до или после знаков равенства в html. http://www.w3schools.com/html/html_attributes.asp – Chad

+0

Я хочу, чтобы значения из всех «строк» ​​во всех «optionContainer» –

ответ

-1

Просто используйте .each() в jQuery.

https://api.jquery.com/each/

$(".questionBlock").each(function(parentIndex) { 
    $(this).each(function(childindex) { 
     // do logic 
    }); 
}); 
+0

Я сделал это, но я вижу, что значения повторяются –

+0

С '$ (this) .each()' или с '$ (". Row ") .each() '? Использование идентификатора 'this' должно работать. – Chad

+0

Я в основном хочу перебрать все div, имеющие имя класса как «optionContainer», и все строки внутри этого параметраContainer, имеющие класс «row». Классовые имена важны. –

0

Это сохранит содержимое всех row элементов в объекте JSON с каждым ключом имени номер строки. (Проверьте консоль, чтобы увидеть результирующий объект):

var stuff = {}; 
 

 
$('.optionContainer .row').each(function(){ 
 
    var curKey = 'row'+ $('.row').index($(this)); 
 
    stuff[curKey]=$(this).html().trim(); 
 
}); 
 
console.log(stuff);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<body data-spy="scroll" data-target="#side-menu"> 
 
<div class="questionBlock"> 
 
    <div class="title">title1</div> 
 
    <div class="optionContainer"> 
 
     <div class="row">1</div> 
 
     <div class="row"> 2 </div> 
 
     <div class="row"> 3 </div> 
 
     <div class="row"> 4 </div> 
 
     <div class="row"> 5 </div> 
 
     <div class="row"> 6 </div> 
 
    </div> 
 
</div> 
 

 
<div class="questionBlock"> 
 
    <div class="title">title2</div> 
 
    <div class="optionContainer"> 
 
     <div class="row">7</div> 
 
     <div class="row"> 8 </div> 
 
     <div class="row"> 13 </div> 
 
     <div class="row"> 24 </div> 
 
     <div class="row"> 15 </div> 
 
     <div class="row"> 16 </div> 
 
    </div> 
 
</div> 
 

 

 
<div class="questionBlock"> 
 
    <div class="title">title3</div> 
 
    <div class="optionContainer"> 
 
     <div class="row">41</div> 
 
     <div class="row"> 42 </div> 
 
     <div class="row"> 43 </div> 
 
     <div class="row"> 44 </div> 
 
     <div class="row"> 45 </div> 
 
     <div class="row"> 46 </div> 
 
    </div> 
 
</div>

Смежные вопросы