Skip to main content
Pergunta fechada como "Não é adequada para este site" por Largato
Tweeted twitter.com/StackOverflowPT/status/1478063623033569280
formatação e aperfeiçoamento
Fonte Link

Conforme o Snippet abaixo, ao clicar em uma checkbox, as outras deveriam ser desmarcadas, porém só acontece se clicar nelas da direita para à esquerda, caso eu clique nelas da esquerda para a direita, nada acontece.


Alguém tem idéia do que está acontecendo?


Explicação:

Ao selecionar um checkbox, aplicarei um filtro X em um campo Y. Já existem outros Radio Button em uso, e meu superior quer que seja usado os checkbox.

var d = document.getElementById('dinheiro');
    var p = document.getElementById('porcentagem');
    var h = document.getElementById('hora');

    function marcaDesmarca() {
        if (d.checked) {
            document.getElementById('porcentagem').checked = false;
            document.getElementById('hora').checked = false;
        } else if (p.checked) {
            document.getElementById('dinheiro').checked = false;
            document.getElementById('hora').checked = false;
        } else if (h.checked) {
            document.getElementById('dinheiro').checked = false;
            document.getElementById('porcentagem').checked = false;
        }
    }
<div style='position: relative;'>
                <input id="dinheiro" name="tipoentrada" type="checkbox" value="D" onclick="marcaDesmarca()"> <label style='display: contents;'>Dinheiro</label>
                <input id="porcentagem" name="tipoentrada" type="checkbox" value="P" onclick="marcaDesmarca()"> <label style='display: contents;'>Porcentagem</label>
                <input id='hora'  name="tipoentrada" type="checkbox" value="H" onclick="marcaDesmarca()"> <label style='display: contents;'>Hora/Minuto</label>
            </div>

Conforme o Snippet abaixo, ao clicar em uma checkbox, as outras deveriam ser desmarcadas, porém só acontece se clicar nelas da direita para à esquerda, caso eu clique nelas da esquerda para a direita, nada acontece.


Alguém tem idéia do que está acontecendo?

var d = document.getElementById('dinheiro');
    var p = document.getElementById('porcentagem');
    var h = document.getElementById('hora');

    function marcaDesmarca() {
        if (d.checked) {
            document.getElementById('porcentagem').checked = false;
            document.getElementById('hora').checked = false;
        } else if (p.checked) {
            document.getElementById('dinheiro').checked = false;
            document.getElementById('hora').checked = false;
        } else if (h.checked) {
            document.getElementById('dinheiro').checked = false;
            document.getElementById('porcentagem').checked = false;
        }
    }
<div style='position: relative;'>
                <input id="dinheiro" name="tipoentrada" type="checkbox" value="D" onclick="marcaDesmarca()"> <label style='display: contents;'>Dinheiro</label>
                <input id="porcentagem" name="tipoentrada" type="checkbox" value="P" onclick="marcaDesmarca()"> <label style='display: contents;'>Porcentagem</label>
                <input id='hora'  name="tipoentrada" type="checkbox" value="H" onclick="marcaDesmarca()"> <label style='display: contents;'>Hora/Minuto</label>
            </div>

Conforme o Snippet abaixo, ao clicar em uma checkbox, as outras deveriam ser desmarcadas, porém só acontece se clicar nelas da direita para à esquerda, caso eu clique nelas da esquerda para a direita, nada acontece.


Alguém tem idéia do que está acontecendo?


Explicação:

Ao selecionar um checkbox, aplicarei um filtro X em um campo Y. Já existem outros Radio Button em uso, e meu superior quer que seja usado os checkbox.

var d = document.getElementById('dinheiro');
    var p = document.getElementById('porcentagem');
    var h = document.getElementById('hora');

    function marcaDesmarca() {
        if (d.checked) {
            document.getElementById('porcentagem').checked = false;
            document.getElementById('hora').checked = false;
        } else if (p.checked) {
            document.getElementById('dinheiro').checked = false;
            document.getElementById('hora').checked = false;
        } else if (h.checked) {
            document.getElementById('dinheiro').checked = false;
            document.getElementById('porcentagem').checked = false;
        }
    }
<div style='position: relative;'>
                <input id="dinheiro" name="tipoentrada" type="checkbox" value="D" onclick="marcaDesmarca()"> <label style='display: contents;'>Dinheiro</label>
                <input id="porcentagem" name="tipoentrada" type="checkbox" value="P" onclick="marcaDesmarca()"> <label style='display: contents;'>Porcentagem</label>
                <input id='hora'  name="tipoentrada" type="checkbox" value="H" onclick="marcaDesmarca()"> <label style='display: contents;'>Hora/Minuto</label>
            </div>

Fonte Link

marcar uma checkbox e desmarcar as outras

Conforme o Snippet abaixo, ao clicar em uma checkbox, as outras deveriam ser desmarcadas, porém só acontece se clicar nelas da direita para à esquerda, caso eu clique nelas da esquerda para a direita, nada acontece.


Alguém tem idéia do que está acontecendo?

var d = document.getElementById('dinheiro');
    var p = document.getElementById('porcentagem');
    var h = document.getElementById('hora');

    function marcaDesmarca() {
        if (d.checked) {
            document.getElementById('porcentagem').checked = false;
            document.getElementById('hora').checked = false;
        } else if (p.checked) {
            document.getElementById('dinheiro').checked = false;
            document.getElementById('hora').checked = false;
        } else if (h.checked) {
            document.getElementById('dinheiro').checked = false;
            document.getElementById('porcentagem').checked = false;
        }
    }
<div style='position: relative;'>
                <input id="dinheiro" name="tipoentrada" type="checkbox" value="D" onclick="marcaDesmarca()"> <label style='display: contents;'>Dinheiro</label>
                <input id="porcentagem" name="tipoentrada" type="checkbox" value="P" onclick="marcaDesmarca()"> <label style='display: contents;'>Porcentagem</label>
                <input id='hora'  name="tipoentrada" type="checkbox" value="H" onclick="marcaDesmarca()"> <label style='display: contents;'>Hora/Minuto</label>
            </div>