gpt4 book ai didi

javascript - 单击复选框时如何设置标签样式?

转载 作者:太空宇宙 更新时间:2023-11-04 05:45:02 25 4
gpt4 key购买 nike

我有一个这样的 html 标记。

<html>
<head></head>
<body>
<input type="checkbox" id="Randomly generated ID" onclick="fun()">
<label for="CHECKBOX_ID" id="Randomly generated ID">SOME TEXT</label>
</body>
</html>

单击复选框后,我想使用 javascript 中的 fun() 函数将 css 样式添加到标签标签。我在这样做时遇到了麻烦,而且这两个元素都有一个随机生成的 ID,并且不能有相同的 ID。

最佳答案

这是使用 Vanilla Js 的实现.

function fun(inputElement) {
var backgroundColor = inputElement.checked ? 'yellow' : 'white';
var labelSelector = 'label[for="' + inputElement.id + '"]';
var labelElement = document.querySelector(labelSelector);
inputElement.style.background = backgroundColor;
labelElement.style.background = backgroundColor;
}
<html>

<head></head>

<body>
<input type="checkbox" id="CHECKBOX_ID" onclick="fun(this)">
<label for="CHECKBOX_ID" id="Randomly generated ID">SOME TEXT</label>
</body>

</html>

希望对您有所帮助,谢谢。

关于javascript - 单击复选框时如何设置标签样式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58787782/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com