提问人：George D 提问时间：6/4/2023 最后编辑：George D 更新时间：6/5/2023 访问量：151
复选框不能用 javascript 点击。.click（） 不是一个函数
Checkbox not clickable with javascript. .click() is not a function
问：
我尝试在 Google Chrome 中使用 JavaScript 自动执行复选框以单击。
这是我检查复选框时浏览器的检查器向我显示的内容：
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square" data-icon="Square" aria-hidden="true" focusable="false"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect></svg>这就是我尝试单击按钮的方式：
document.getElementsByClassName('lucide lucide-square')[0].click();
它确实可以识别元素，但不会单击它。
它返回错误：
VM3971:1 Uncaught TypeError: document.getElementsByClassName(...)[0].click is not a function
at <anonymous>:1:60
有人可以帮忙吗？
我也尝试过或使用querySelector调用元素，但它不起作用。.onclick
我希望该复选框能像同一网站上的其他复选框一样工作，这些复选框都可以点击.click()
答：
0赞
Michael M.
6/4/2023
#1
您尝试单击的元素实际上不是一个按钮，而是一个 <svg> 元素，看起来像一个按钮，但实际上更像是一个图像。只有真正的按钮才有这个方法，但是你可以通过使用 CustomEvent 创建一个新事件并将其发送到按钮来人为地触发事件：.click()click
const btn = document.getElementsByClassName('lucide lucide-square')[0];
// example event handler
btn.addEventListener('click', function() {
console.log('clicked');
});
var event = new CustomEvent('click');
btn.dispatchEvent(event);<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square" data-icon="Square" aria-hidden="true" focusable="false"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect></svg>评论
0赞
George D
6/4/2023
谢谢，迈克尔。我试过了，但没有成功。我只从控制台收到“已点击”消息和“true”。
1赞
George D
6/4/2023
#2
所以我发布了@LouysPatriceBessette的答案，这对我有用
document.getElementsByClassName('lucide lucide-square')[0].parentElement.click()
评论
.getElementsByClassName()length