這是動態生成的欄位。為了簡單起見,我洗掉了不必要的代碼當我點擊一個按鈕時,請幫我生成一個 JSON 物件陣列
<div class="row sertile">
<input type="hidden" value="Service">
<input type="hidden" value="144">
<input type="hidden" value="Full face">
<input type="hidden" value="200">
<input type="hidden" value="0">
<input type="hidden" value="30">
</div>
<div >
<input type="hidden" value="Service">
<input type="hidden" value="124">
<input type="hidden" value="Half face">
<input type="hidden" value="200">
<input type="hidden" value="0">
<input type="hidden" value="30">
</div>
我需要輸出為:
[
{
parType: 'Service',
id: 144,
serviceName: 'Full Face',
...
},
{
parType: 'Service',
id: 124,
serviceName: 'Half Face',
...
},
...
]
uj5u.com熱心網友回復:
我找到了解決這個問題的方法。謝謝大家的幫助。
function createJSON() {
jsonObj = [];
$(".sertile").each(function() {
var id = $(this).find("#serId").val();
var name = $(this).find("#serName").val();
item = {}
item["title"] = id;
item["email"] = name;
jsonObj.push(item);
});
console.log(jsonObj);
}
uj5u.com熱心網友回復:
您可以嘗試使用Array.prototype.map()如下方式:
//attach click event to button
document.querySelector('#btnGenerate').addEventListener('click', function(){
//get all rows
var rows = document.querySelectorAll('.row.sertile');
//loop through them using map(), generate and return the object
var res = [...rows].map(el => {
return ({
parType: el.querySelector('.parType').value,
id: el.querySelector('.id').value,
serviceName: el.querySelector('.serviceName').value,
mrp: el.querySelector('.mrp').value,
dis: el.querySelector('.dis').value,
dur: el.querySelector('.dur').value
});
});
//log the result
console.log(res);
})
<div class="row sertile">
<input type="hidden" class="form-control parType" value="Service">
<input type="hidden" class="form-control id" value="144">
<input type="hidden" class="form-control serviceName" value="Full face">
<input type="hidden" class="form-control mrp" value="200">
<input type="hidden" class="form-control dis" value="0">
<input type="hidden" class="form-control dur" value="30">
</div>
<div class="row sertile">
<input type="hidden" class="form-control parType" value="Service">
<input type="hidden" class="form-control id" value="124">
<input type="hidden" class="form-control serviceName" value="Half face">
<input type="hidden" class="form-control mrp" value="200">
<input type="hidden" class="form-control dis" value="0">
<input type="hidden" class="form-control dur" value="30">
</div>
<input type="button" id="btnGenerate" value="Generate"/>
uj5u.com熱心網友回復:
您是否嘗試過使用Element.getElementsByClassName()?
一個想法可能是在您的 div 中添加一個標簽并getElementsByClassName在檔案中獲取它們,然后遍歷它們以通過其類獲取每個欄位并將其添加到一個物件中,然后您可以根據需要將其轉換為字串 json到
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/365829.html
標籤:javascript 数组 json 目的
