如何獲取數組中所有帶有class的元素並將其發送到rest服務？

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>

我需要數組（json）中的秒殺功能和名稱才能將其發送到我的REST服務。

有什么幫助嗎？

Answer 1

找到Item后，請使用.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>