[英]How can I select a random amount of checkboxes?
$('#select_all').on('click', function () {
if (this.checked) {
$('.check').each(function () {
this.checked = true;
});
} else {
$('.check').each(function () {
this.checked = false;
});
}
});
$('.check').on('click', function () {
if ($('.check:checked').length == $('.check').length) {
$('#select_all').prop('checked', true);
} else {
$('#select_all').prop('checked', false);
}
});
需要將上面的 Select 所有代碼更改為只有 select 一些隨機數量的復選框,如下面的代碼示例。 有什么幫助嗎?
$(".random-pick").click(function() {
var maxAllowed = 6;
// Count checkboxes
var random_checkboxes = $("#content_subscribtion_ input.checkbox").size();
// Check random checkboxes until "maxAllowed" limit reached
while ($("#content_subscribtion_ input.checkbox:checked").size() < maxAllowed) {
// Pick random checkbox
var random_checkbox = Math.floor(Math.random() * random_checkboxes) + 1;
// Check it
$("#content_subscribtion_ input.checkbox:nth-child(" + random_checkbox + ")").prop("checked", true);
}
return false;
});
使用這種整潔的小洗牌方法,我們可以創建一個隨機的復選框索引數組,然后將其切片為隨機數。 然后我們可以迭代並使用 jQuery 的get()
在隨機數組中找到要檢查的復選框索引。
Array.prototype.shuffle = function() { let m = this.length, i; while (m) { i = (Math.random() * m--) >>> 0; [this[m], this[i]] = [this[i], this[m]] } return this; } $('#select_all').on('click', function() { if ($(this).prop('checked')) { let minnum = 3, maxnum = 6 let rand = Math.min(maxnum, Math.floor(Math.random() * ($('.check').length - 1 - minnum)) + minnum) //create our keys array let keyArray = [...Array($('.check').length).keys()].shuffle().slice(0, rand) keyArray.forEach((chk_i, i) => { if (i < rand) $($('.check').get(chk_i)).prop('checked', true) }) } else { $('.check').prop('checked', false); } });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <label>Select all <input type='checkbox' id="select_all"></label> <div class='cb'> <input type='checkbox' class='check'> checkbox <br /> <input type='checkbox' class='check'> checkbox <br /> <input type='checkbox' class='check'> checkbox <br /> <input type='checkbox' class='check'> checkbox <br /> <input type='checkbox' class='check'> checkbox <br /> <input type='checkbox' class='check'> checkbox <br /> <input type='checkbox' class='check'> checkbox <br /> <input type='checkbox' class='check'> checkbox <br /> <input type='checkbox' class='check'> checkbox <br /> <input type='checkbox' class='check'> checkbox <br /> <input type='checkbox' class='check'> checkbox <br /> <input type='checkbox' class='check'> checkbox <br /> <input type='checkbox' class='check'> checkbox <br /> <input type='checkbox' class='check'> checkbox <br /> <input type='checkbox' class='check'> checkbox <br /> </div>
我在 UI 上有 8 個復選框,我隨機選擇了 3 個復選框。 每次運行后,將選中不同的復選框。 請在cy.get('xxxxxx')
中使用 exact/clean/proper checkbox common unique identifier 並在 JS 中使用以下代碼:
cy.get('section[class="table-body-cell checkbox-cell grid-1"] input')
.then(
($items) => {
return Cypress._.sampleSize($items.toArray(), 3)
})
.check({force: true});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.