クラス内のすべての要素を配列で取得し、それを休憩サービスに送るにはどうすればいいですか？ここ

Question

は私の問題です：

$(".Item").each(function(i, obj) { 
    alert(i.id); 
}); 

私はクラスが「アイテム」で、各要素を取得するためにしようと試みました。

<div class="panel panel-default Item"> 
<div class="panel-body"> 
    <div class="col-md-4 col-xs-10"> 
     <h5 id="spikeName">{{spikeName}}</h5> 
    </div> 
    <div class="col-md-7 col-xs-10"> 
     <h5 id="spikeEffort">{{spikeEffort}} Tag/e</h5> 
    </div> 
    <div class="col-md-1 col-xs-1"> 
     <button type="button" class="btn btn-default" onclick="$(this).closest($({{item}})).remove()"> 
      <span class="glyphicon glyphicon-minus" aria-hidden="true"></span> 
     </button> 
    </div> 
</div> 

私は私のRESTサービスに送信する配列（JSON）でspikeEffortと名前を必要としています。

お願いします。

Answer 1

要素をさらに詳しく調べると、.findを使用してください。

$(".Item").each(function() { 
 
     console.log($($(this).find('#spikeName')).html()); 
 
     //Send spikeName to rest API 
 
     console.log($($(this).find('#spikeEffort')).html()); 
 
     //Send spikeEffort to rest API 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="panel panel-default Item"> 
 
<div class="panel-body"> 
 
    <div class="col-md-4 col-xs-10"> 
 
     <h5 id="spikeName">{{spikeName}}</h5> 
 
    </div> 
 
    <div class="col-md-7 col-xs-10"> 
 
     <h5 id="spikeEffort">{{spikeEffort}} Tag/e</h5> 
 
    </div> 
 
    <div class="col-md-1 col-xs-1"> 
 
     <button type="button" class="btn btn-default" onclick="$(this).closest($({{item}})).remove()"> 
 
      <span class="glyphicon glyphicon-minus" aria-hidden="true"></span> 
 
     </button> 
 
    </div>

Answer 2

$arr=[]; 
 
$.each($('.Item'),function(index,object){ 
 
    $jsonobjcet ={ 
 
      'skipeName': $(object).find('#spikeName').text(), 
 
      'skipeEffort':$(object).find('#spikeEffort').text() 
 
     } 
 
    $arr.push($jsonobjcet); 
 
}); 
 
console.log($arr) 
 
// now you can send this array to web service

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="panel panel-default Item"> 
 
<div class="panel-body"> 
 
    <div class="col-md-4 col-xs-10"> 
 
     <h5 id="spikeName">{{spikeName}}</h5> 
 
    </div> 
 
    <div class="col-md-7 col-xs-10"> 
 
     <h5 id="spikeEffort">{{spikeEffort}} Tag/e</h5> 
 
    </div> 
 
    <div class="col-md-1 col-xs-1"> 
 
     <button type="button" class="btn btn-default" onclick="$(this).closest($({{item}})).remove()"> 
 
      <span class="glyphicon glyphicon-minus" aria-hidden="true"></span> 
 
     </button> 
 
    </div> 
 
</div> 
 

 
<div class="panel panel-default Item"> 
 
<div class="panel-body"> 
 
    <div class="col-md-4 col-xs-10"> 
 
     <h5 id="spikeName">{{spikeName}}</h5> 
 
    </div> 
 
    <div class="col-md-7 col-xs-10"> 
 
     <h5 id="spikeEffort">{{spikeEffort}} Tag/e</h5> 
 
    </div> 
 
    <div class="col-md-1 col-xs-1"> 
 
     <button type="button" class="btn btn-default" onclick="$(this).closest($({{item}})).remove()"> 
 
      <span class="glyphicon glyphicon-minus" aria-hidden="true"></span> 
 
     </button> 
 
    </div> 
 
</div>