[英]How to count number of objects I create?
我可以使用以下 html 編碼創建成員對象。 但是對於某些計算,我需要獲取成員對象的計數。 此外,當我刪除成員 object 之一時,它應該減少成員對象的數量。
以下函數將創建成員。
function appendMember(rowNumber) {
debugger
var subrowNumber = parseInt($("#itemmapWrapper" + rowNumber + "").attr("data-subrowNumber"));
subrowNumber = isNaN(subrowNumber) ? 1 : subrowNumber + 1;
var addNewItemDetailHtml = "<div class='col-lg-10 col-md-10 col-sm-10 col-xs-10 itemmapAllocationWrapper custom-paaddingnone form-group' \
id='dvaddNewItemDetailSub" + subrowNumber + "' data-subrowNumber='" + subrowNumber + "'>";
addNewItemDetailHtml += "<div class='col-lg-4 col-md-4 col-sm-4 col-xs-4 custom-paaddingnone'>\
<div class='col-lg-3 col-md-3 col-sm-3 col-xs-3 custom-paaddingnone text-center'>\
</div>\
<div class='col-lg-9 col-md-9 col-sm-9 col-xs-9 custom-paaddingnone'>\
<div class='col-lg-12 col-md-12 col-sm-12 col-xs-12 custom-paaddingnone'>\
<div class='col-lg-10 col-md-10 col-sm-10 col-xs-10 custom-paaddingnone'>\
<select class='form-control' id ='memberid"+ rowNumber + subrowNumber + "' ></select>\
</div>\
</div>\
</div>\
</div>";
addNewItemDetailHtml += "<div class='col-lg-2 col-md-2 col-sm-2 col-xs-2 custom-paaddingnone'>\
<span class='glyphicon glyphicon-trash removeBtn' onclick = 'removeMemberDetail(this)' ></span >\
</div>";
addNewItemDetailHtml += "</div>";
addNewItemDetailHtml += "</div>";
$("#itemmapWrapper" + rowNumber + "").attr("data-subrowNumber", subrowNumber);
$(".memberContainer").append(addNewItemDetailHtml);
intialize_memberDropDown(rowNumber, subrowNumber);
}
此代碼將從 db 獲取數據到成員 select 菜單。
function intialize_memberDropDown(rowNumber, subrowNumber) {
$.ajax({
type: "GET",
url: "/Member/GetAllMember/",
cache: false,
success: function (data) {
debugger
var countryHTMLString = "<option value ='0'>Select Member</option>";
if (data.isSucess) {
$.each(data.data, function (index, item) {
countryHTMLString += "<option value ='" + item.memberid + "'>" + item.membername + "</option>";
});
}
$("#memberid" + rowNumber + subrowNumber + "").html(countryHTMLString)
calculateTotalHotailBill(rowNumber)
}, error: function (err) {
debugger
}
});
}
這個最終代碼將刪除一個成員,我單擊在 append 成員 function 上實現的垃圾按鈕。
function removeMemberDetail(buttonElement) {
debugger
$(buttonElement).parents(".itemmapAllocationWrapper").remove();
if ($(".itemmapAllocationWrapper").html() == "") {
$("#memberid").removeAttr("disabled");
}
}
您可以計算您的 memberContainer 的孩子。 如果你只有一個,我會給它一個 id 而不是類名。 但它是雙向的。
console.log(document.getElementsByClassName("memberContainer")[0].children.length)
<div class="memberContainer"> <div>child</div> <div>child</div> <div>child</div> </div>
只需添加一個帶有 0 值的隱藏輸入或任何您的對象初始值,每次您使用添加成員代碼時增加它,當您使用刪除成員時減少它您的 html
<input type='hidden' id='objectsCounter' value='0'>
java 腳本增加 function 在它的末尾添加這一行
var objectCounter = document.getElementById('objectsCounter').value;
objectCounter++;
document.getElementById('objectsCounter').value = objectCounter
並在刪除成員 function 的末尾添加此
var objectCounter = document.getElementById('objectsCounter').value;
objectCounter--;
document.getElementById('objectsCounter').value = objectCounter
您可以隨時使用獲取對象的值
var objectCounter = document.getElementById('objectsCounter').value;
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.