爲什麼複選框檢查的ID在這種情況下漸漸空虛

Question

當我選中狀態批准，並點擊複選框並單擊刪除按鈕， 我收到ID爲空

請你讓時間知道如何解決這個問題

Jsfiddle

我的代碼：

$(document).on('click', '#deletebtn', function(event) { 
    var $checked = $('#tablecontent').find(":checkbox:checked"); 
    if (confirm("Are you Sure to Delete") == true) { 
    var ids = []; 
    $.each($checked, function(i, e) { 
     var status = $(e).parent().parent().find('.label-status').text(); 
     var filterstatus = $('#filterstatus').val(); 
     if (!filterstatus) { 
     ids.push($(e).attr("id")); 
     } else { 
     if ($(e).attr("id") != 'selectall' && status == $('#filterstatus').val()) { 
      ids.push($(e).attr("id")) 
     } 
     } 
    }); 

     alert(ids); 
    }  

});  

Answer 1

問題：當您試圖通過使用jQuery的Parent方法獲取行/記錄的狀態時，它實際上並沒有獲取正確的元素，您可以在其中找到狀態。

解決方案：下面的代碼行更改

var status = $(e).parent().parent().find('.label-status').text(); 

到

var status = $(e).closest('.AddreqTableCols').find('.label-status').text(); 

Answer 2

我想這就是你正在嘗試做的，如果沒有足夠的正在發生的事情清晰，手感隨意問。

$("#selectall").click(function (e) { 
    var $this = $(this); 
    $("#tablecontent [type='checkbox']").prop("checked", $this.is(":checked")); 
}); 

$("#deletebtn").click(function (e) { 
    if (!confirm("Are you sure you want to delete?")) return; 

    var $checked = $("#tablecontent [type='checkbox']:checked"); 
    var ids = $.map($checked, function (chk) { 
     return $(chk).attr("id"); 
    }); 
    console.log(ids); 
    alert(ids.join(",")); 
}); 

http://jsfiddle.net/cdkLkcdk/48/

COMMENT 如果我被分配到寫同樣的事情，我會設置狀態爲上的複選框本身使事情更容易data-status。

Answer 3

問題是status總是空的。當您選擇一個filterstatus時，它將出現在新的if檢查中，並且status == $('#filterstatus').val()將始終爲假，因爲status爲空。

你的代碼更改爲：

var status = $(e).parent().parent().parent().find('.label-status').text(); 

你忘了一個額外的.parent()。

注意：您始終可以使用console.log()來測試您的變量是否填寫正確。