我怎样才能做到这一点？将复选框从只读更改为可用于检查

Posted 2021-05-06

我使用html和CSS创建了一个包含5个复选框的列表。第一个总是能够被检查，但其他四个是初始只读。然后，当检查第一个时，第二个应该从readonly改变为可用于检查。检查第二个后，第三个也必须改变，依此类推。我怎么能这样做？

答案

简答：javascript

更多解释：

你想要的是listen到第一个复选框，这样你就可以在下一个复选框上更改属性。

const box1 = document.querySelector('#box1')
const box2 = document.querySelector('#box2')
box1.addEventListener('change', () => {
  box2.readonly = false 
})

我没有测试这段代码，但这应该让你开始

另一答案

此代码适用于或多或少的常见情况

    for (let i = 1; i < 5; i++) {
        const item = document.querySelector('#cbk' + i);
        item.addEventListener('change', () => {
            var newId = +item.id.replace('cbk', '') + 1;
            document.querySelector('#cbk' + newId).readonly = false;
        })
    }