我正在嘗試根據單選值有條件地為陣列中的每個專案分配一個屬性。我已經開始實際設定所需的屬性,但由于某種原因,我只能在專案上單獨設定它,而不是在我的陣列中呼叫的每個元素上設定它。我確定我正在做的事情就像拇指酸痛一樣突出,但 javascript 不是我的強項。
我嘗試過的:在forEach(function (item, i){item.setAttribute('required','true'}; - 回傳“item.setAttribute is not a function”
//assign required fields to variable
const reqCollection = [document.getElementsByClassName("reqcheck")];
console.log(reqCollection);
document.addEventListener('DOMContentLoaded', () => {
// on .conditional_radio-wrapper click
document.querySelectorAll('.conditional_radio-wrapper').forEach(trigger => {
trigger.addEventListener('click', function () {
//assign variable for "Are you a realtor?"
let realtorRadio = document.querySelector('input[name="realtorChoice"]:checked').value;
//log realtorRadio
console.log(realtorRadio);
//assign variable for "Are you represented by a realtor?"
let repRadio = document.querySelector('input[name="realtorRep"]:checked').value;
console.log(repRadio);
//assign required fields to variable
//if they are a realtor or represented by one
if (realtorRadio == "Yes" || repRadio == "Yes") {
reqCollection.forEach(function (item, i) {
//does work
item[0].setAttribute('required', 'true');
item[1].setAttribute('required', 'true');
item[2].setAttribute('required', 'true');
//doesn't work
item.setAttribute('required', 'true');
});
}
//else mark as not required
else {
reqCollection.forEach(function (item, i) {
item[0].removeAttribute('required');
item[1].removeAttribute('required');
item[2].removeAttribute('required');
});
}
});
});
});
uj5u.com熱心網友回復:
這條線是有問題的:
const reqCollection = [document.getElementsByClassName("reqcheck")];
您將獲得一個 HTML 集合陣列并將其封裝在另一個陣列中。
我會推薦這個:
const reqCollection = document.querySelectorAll(".reqcheck");
然后你可以迭代
reqCollection.forEach(item => item.setAttribute('required', 'true'));
uj5u.com熱心網友回復:
在您的實作中,reqCollection變數是一個只有一個元素的陣列,該元素是從HTMLCollection回傳的getElementsByClassName,您需要通過展開運算子在陣列內展開元素document.getElementsByClassName("reqcheck")
const reqCollection = [...document.getElementsByClassName("reqcheck")];
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/506211.html
標籤:javascript 数组 单选按钮 设置属性
