使用li項目中的javascript獲取數據屬性檢索的ID

Question

JavaScript的

---

var sessions = [];
$('.rightDiv').each(function(index) {
    var session = $.trim($(this).text().slice(0, -1)).split("×");
    var sessionData = [];
    for (var i = 0; i < session.length; i++) {
        var ids = $(this).find('li').data('id');
        var s = {
            subjectOrder: i,
            subjectID: ids
        };
        sessionData.push(s);
    }
    var ses = {
        sessionNo: index,
        sessionData: sessionData
    };
    sessions.push(ses);
});

HTML

---

 <ul id="form_builder_sortable_sample" class="sortable rightDiv session4 ui-sortable"> 
  <li class="draggable" data-id="1" name="Counting" >Counting<button onclick="deleteElement(event)" class="delbtn">×</button></li>
  <li class="draggable" data-id="2" name="Priorities" >Priorities" class="delbtn">×</button></li>
 </ul>

JSON

---

{"sessionNo":"0","sessionData":[{"subjectOrder":"0","subjectID":"1"},{"subjectOrder":"1","subjectID":"1"}]}

我的問題

---

上面的代碼所做的是從ul類中檢索會話號： class="sortable rightDiv session4"並從data-id檢索li的每個data-id 。

在這種情況下，它在li項之間循環良好，但僅顯示第一個li元素的id。 它應該是：

{"sessionNo":"0","sessionData":[{"subjectOrder":"0","subjectID":"1"},{"subjectOrder":"1","subjectID":"2"}]}

知道有什么問題嗎？

Answer 1

由於您正在使用$(this).find('li').data('id'); ，它將始終返回第一個li數據屬性的值。

使用.each()迭代並創建一個數組

var sessionData = [];

$(this).find('li').each(function (index, elem) {
    sessionData.push({
        subjectOrder: index,
        subjectID: $(elem).data('id')
    });
})

Answer 2

更改：

var ids  = $(this).find('li').data('id');

至：

var ids  = $(this).find('li').eq(i).data('id');