仅在选中复选框时发送POST请求 [英] Send POST request only if check box is checked

问题描述

所以我试图让我的脚本只在复选框被选中时记录并发送 POST 请求......问题是当我取消选中该框时.它仍在发送 post 请求.

So I'm trying to make my script only log and send the POST request if the check box is checked... The problem is when I un-check the box. It's still sending the post request.

这个脚本基本上是为特定元素添加复选框，如果选中则获取 ID 值.

This script basically adds check boxes to a specific elements, and gets the ID value if it's checked.

这是我的脚本:

const userlist = document.querySelector('#userlist');
new MutationObserver(() => {
userlist.querySelectorAll('.user:not([data-has-checkbox])').forEach((userDiv) => {
const checkbox = userDiv.insertBefore(document.createElement('input'), userDiv.children[0]);
checkbox.type = 'checkbox';
userDiv.dataset.hasCheckbox = true;
});
}).observe(userlist, { childList: true });

userlist.addEventListener('change', ({ target }) => {
if (target.matches('.user > input[type="checkbox"]')) {
const userDiv = target.parentElement;
var nameb = userDiv.id.replace("user_", ""); // Make variable for REQUEST
}

var evtSource = new EventSource("http://myurl.com/_watch//_index?_=1557958948927");

evtSource.onmessage = function(e) {
var obj = JSON.parse(e.data);
var line = JSON.stringify(obj.line)
var size = JSON.stringify(obj.lineWidth)
var color = JSON.stringify(obj.lineColor) // Not needed, but defined 
anyways.
var chat = JSON.stringify(obj.msg)
var original = line
//var mirror = JSON.parse(JSON.stringify(original).replace(/\d+/g, number => 20 + +number))
var list = JSON.parse(JSON.stringify(userList)) //LineLog


//--------------------------



if (obj.ident === nameb) // if ident ='s userDiv's Id value...
{
$.post("/draw.php?ing=_index", {
           l: (line),
           w : parseInt(obj.lineWidth) + 2,
           c: ("ffffff"),
            o: ("100"),
            f: ("1"),
            _: ("false")
})
console.log(nameb) //log the value.
}
});

如果你能帮我找到一个很好的解决方案.谢谢.

If you can help me find a solution that would be great. Thank you.

推荐答案

你试过了吗?

const checkbox = document.querySelector('#myCheckBox');

checkbox.addEventListener('change', e => {
    const self = e.target;
    if (self.checked){
        // send
    }
})

const userlist = document.querySelector('#userlist');
new MutationObserver(() => {
userlist.querySelectorAll('.user:not([data-has-checkbox])').forEach((userDiv) => {
const checkbox = userDiv.insertBefore(document.createElement('input'), userDiv.children[0]);
checkbox.type = 'checkbox';
userDiv.dataset.hasCheckbox = true;
});
}).observe(userlist, { childList: true });

userlist.addEventListener('change', (e, { target }) => {
if ( !e.target.checked ) return
if (target.matches('.user > input[type="checkbox"]')) {
const userDiv = target.parentElement;
var nameb = userDiv.id.replace("user_", "");
}

var evtSource = new EventSource("http://myurl.com/_watch//_index?_=1557958948927");

evtSource.onmessage = function(e) {
var obj = JSON.parse(e.data);
var line = JSON.stringify(obj.line)
var size = JSON.stringify(obj.lineWidth)
var color = JSON.stringify(obj.lineColor) // Not needed, but defined 
anyways.
var chat = JSON.stringify(obj.msg)
var original = line
//var mirror = JSON.parse(JSON.stringify(original).replace(/\d+/g, number => 20 + +number))
var list = JSON.parse(JSON.stringify(userList)) //LineLog


//--------------------------



if (obj.ident === nameb) // if ident ='s userDiv's Id value...
{
$.post("/draw.php?ing=_index", {
           l: (line),
           w : parseInt(obj.lineWidth) + 2,
           c: ("ffffff"),
            o: ("100"),
            f: ("1"),
            _: ("false")
})
console.log(nameb) //log the value.
}
});

这篇关于仅在选中复选框时发送POST请求的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！