我正在嘗試在我的網站中為一些不同的頁面實作一個喜歡按鈕,并且我正在使用套接字 io,因此當按下喜歡按鈕時它會為每個用戶更新。我有一個簡單的函式,like()它發出liked然后使計數器上升并顯示在頁面上。不過這不是問題。我決定做一個復選框,這樣當復選框不受歡迎時我可以做一些事情。我也有一個有效的功能。當它未經檢查時,我無法做某事。這是我用來查看復選框是否被選中的內容:
if(document.getElementById('like').checked) {
like()
}
這在檢查時沒有任何作用。我什至試圖只替換為like(),socket.emit('liked')但這也不起作用。檢查復選框是否被選中的正確方法是什么?(最好沒有 Jquery)
html檔案:
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta charset="utf-8">
<link rel="stylesheet" href="styles.css">
</head>
<body>
<p id="likes">Likes: </p>
<input type="checkbox" id="like"></input>
<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io.connect();
if(document.getElementById('like').checked) {
like()
}
function like(){
socket.emit('liked');
}
function un_like(){
socket.emit('unliked');
}
socket.on('buttonUpdate', function(data){
document.getElementById("likes").innerHTML = 'Likes: ' data;
});
</script>
</body>
</html>
uj5u.com熱心網友回復:
添加addEventListener到復選框
var checkbox = document.querySelector("input[id=like]");
checkbox.addEventListener('change', function() {
if (this.checked) {
console.log("Checkbox is checked..");
} else {
console.log("Checkbox is not checked..");
}
});
<input type="checkbox" id="like">Checkbox</input>
uj5u.com熱心網友回復:
使用onChange來處理這個問題。補充閱讀
<input type="checkbox" id="like" onChange="clickHandler(this)"></input>
function clickHandler(checkbox) {
if(checkbox.checked) {
like()
}
}
示例代碼:
function clickHandler(checkbox) {
if(checkbox.checked) {
console.log('selected')
} else {
console.log('unselected')
}
}
select / unselect: <input type="checkbox" id="like" onChange="clickHandler(this)"></input>
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/347301.html
標籤:javascript html 节点.js 复选框 socket.io
上一篇:value=是否需要HTML輸入復選框的一部分,或者值本身是否足夠
下一篇:如何使用Scrapy高效抓取網站
