单击每个第一个子无线电(未定义的子长度)
Click on each first child radio (undefined child length)
我想点击 class="cf" 的每个第一个子节点并且应该按顺序排列,第一个 cf 首先,因为除非您单击第一个,否则另一个无线电被禁用。 cf 长度未确定(在本例中我输入 3)所以我需要先获取 ol > li 的子项的长度并循环点击那里。
这是HTML
的结构
<div id="group-attr-selects" class="grouped-select">
<ol>
<li class="opt-label">Dimensions</li>
<div id="conf-container-1549" class="cf">
<div class="optdiv">
<input name="conf-radio-0" id="conf-radio-1461" type="radio" value="1461">
<label class="optdiv-label" for="conf-radio-1461">3" H x 3" W</label>
</div>
<div class="optdiv">
<input name="conf-radio-0" id="conf-radio-1421" type="radio" value="1421">
<label class="optdiv-label" for="conf-radio-1421">4" H x 4" W</label>
</div>
</div>
<div id="err-attribute1549" style="color: red; margin-bottom: 5px"></div>
<li class="opt-label">Color</li>
<div id="conf-container-1379" class="cf">
<div class="optdiv">
<input name="conf-radio-1" id="conf-radio-12791" type="radio" value="12791">
<label class="optdiv-label" for="conf-radio-12791">Black on Almond</label>
</div>
<div class="optdiv">
<input name="conf-radio-1" id="conf-radio-12796" type="radio" value="12796">
<label class="optdiv-label" for="conf-radio-12796">Black on Brushed Aluminum</label>
</div>
<div class="optdiv">
<input name="conf-radio-1" id="conf-radio-12798" type="radio" value="12798">
<label class="optdiv-label" for="conf-radio-12798">Black on Brushed Brass</label>
</div>
<div class="optdiv">
<input name="conf-radio-1" id="conf-radio-12794" type="radio" value="12794">
<label class="optdiv-label" for="conf-radio-12794">Black on Brushed Gold</label>
</div>
</div>
<div id="err-attribute1379" style="color: red; margin-bottom: 5px"></div>
<li class="opt-label">Mounting Type</li>
<div id="conf-container-2605" class="cf">
<div class="optdiv">
<input name="conf-radio-2" id="conf-radio-76" type="radio" value="76">
<label class="optdiv-label" for="conf-radio-76">Adhesive</label>
</div>
<div class="optdiv">
<input name="conf-radio-2" id="conf-radio-762" type="radio" value="762">
<label class="optdiv-label" for="conf-radio-762">No Mounting</label>
</div>
</div>
<div id="err-attribute2605" style="color: red; margin-bottom: 5px"></div>
</ol>
这应该有效:
jQuery:
$('.cf').each(function(i, item){$(item).find('input[type="radio"]')[0].click()})
JS:
Array.from(document.getElementsByClassName('cf')).forEach(function(item){item.querySelector('input[type="radio"]').checked = true})
从
得到解决方案
我刚刚做了一些调整。
.findAllByCssSelector('#group-attr-selects > ol > div.cf')
.then(function (elementArray) {
return Promise.all(elementArray.map(function (element) {
return element.getVisibleText()
.then(function (children) {
for(var i=0; i < children.length; i++){
return element.findByCssSelector('.optdiv > input')
.then(function (inp) {
return inp.click();
});
}
});
}));
})
我想点击 class="cf" 的每个第一个子节点并且应该按顺序排列,第一个 cf 首先,因为除非您单击第一个,否则另一个无线电被禁用。 cf 长度未确定(在本例中我输入 3)所以我需要先获取 ol > li 的子项的长度并循环点击那里。
这是HTML
的结构<div id="group-attr-selects" class="grouped-select">
<ol>
<li class="opt-label">Dimensions</li>
<div id="conf-container-1549" class="cf">
<div class="optdiv">
<input name="conf-radio-0" id="conf-radio-1461" type="radio" value="1461">
<label class="optdiv-label" for="conf-radio-1461">3" H x 3" W</label>
</div>
<div class="optdiv">
<input name="conf-radio-0" id="conf-radio-1421" type="radio" value="1421">
<label class="optdiv-label" for="conf-radio-1421">4" H x 4" W</label>
</div>
</div>
<div id="err-attribute1549" style="color: red; margin-bottom: 5px"></div>
<li class="opt-label">Color</li>
<div id="conf-container-1379" class="cf">
<div class="optdiv">
<input name="conf-radio-1" id="conf-radio-12791" type="radio" value="12791">
<label class="optdiv-label" for="conf-radio-12791">Black on Almond</label>
</div>
<div class="optdiv">
<input name="conf-radio-1" id="conf-radio-12796" type="radio" value="12796">
<label class="optdiv-label" for="conf-radio-12796">Black on Brushed Aluminum</label>
</div>
<div class="optdiv">
<input name="conf-radio-1" id="conf-radio-12798" type="radio" value="12798">
<label class="optdiv-label" for="conf-radio-12798">Black on Brushed Brass</label>
</div>
<div class="optdiv">
<input name="conf-radio-1" id="conf-radio-12794" type="radio" value="12794">
<label class="optdiv-label" for="conf-radio-12794">Black on Brushed Gold</label>
</div>
</div>
<div id="err-attribute1379" style="color: red; margin-bottom: 5px"></div>
<li class="opt-label">Mounting Type</li>
<div id="conf-container-2605" class="cf">
<div class="optdiv">
<input name="conf-radio-2" id="conf-radio-76" type="radio" value="76">
<label class="optdiv-label" for="conf-radio-76">Adhesive</label>
</div>
<div class="optdiv">
<input name="conf-radio-2" id="conf-radio-762" type="radio" value="762">
<label class="optdiv-label" for="conf-radio-762">No Mounting</label>
</div>
</div>
<div id="err-attribute2605" style="color: red; margin-bottom: 5px"></div>
</ol>
这应该有效:
jQuery:
$('.cf').each(function(i, item){$(item).find('input[type="radio"]')[0].click()})
JS:
Array.from(document.getElementsByClassName('cf')).forEach(function(item){item.querySelector('input[type="radio"]').checked = true})
从
我刚刚做了一些调整。
.findAllByCssSelector('#group-attr-selects > ol > div.cf')
.then(function (elementArray) {
return Promise.all(elementArray.map(function (element) {
return element.getVisibleText()
.then(function (children) {
for(var i=0; i < children.length; i++){
return element.findByCssSelector('.optdiv > input')
.then(function (inp) {
return inp.click();
});
}
});
}));
})