1. java
  2. android
  3. c#
  4. .net
  5. javascript
  6. php
  7. jquery
  8. html
  9. sql

Editar lista (<li>) removerndo item da lista editado

Estou criando uma lista que é preenchida por um input até ai tudo bem.. mas quando do dois clicks em um dos itens da minha lista cria um input para que poça editar o item porem depois de editado era para voltar a ser uma "li", consegui criar outro item a partir desse editado agora quero ajuda para remover a "li" onde editei o item para ficar como se fosse o mesmo editado.

<html>

<head>

    <title>Demo</title>

    <scrip>
 function OnEnter(evt) {
    var key_code = evt.keyCode ? evt.keyCode :
                       evt.charCode ? evt.charCode :
                       evt.which ? evt.which : void 0;

    if (key_code == 13) {
        return true;
    }
}
var j = 1;
function recarrega(e)
{

    if(OnEnter(e))
    {
        var p = document.getElementById('Foo');
        var filhos = p.childNodes;
        for (i = filhos.length - 1; i >= 0; i--) {
            if (filhos[i].tagName == 'LI') {
                p.appendChild(filhos[i]);
            }
        }

        var tarefa = document.getElementById("my_span").value;


        document.getElementById("my_span").value = "";

        var li = document.createElement('li');
        p.appendChild(li);
        li.id = 'my_span'+ j;
        li.innerHTML = "<input type='checkbox' id='ckb" + j + "' value='" + j + "' onclick='my_fun(" + j + ");'>" + tarefa;
        li.ondblclick = function () {
            li.innerHTML = "<input type='checkbox' id='ckb" + j + "' value='" + j + "' onclick='my_fun(" + j + ");'> <input id='my_li' type='text' onkeypress='return volta(event);' value='" + tarefa + "'>"
        };


        j++;

        return false;
    }
    else
    {
        return true;
    }
}

function my_fun(j) {
    var chkbox = "ckb" + j;
    var my_span = "my_span" + j;
    var msg = chkbox + " " + my_span;
    if ($("#ckb"+ j).is(':checked')) {
        document.getElementById(my_span).style.textDecoration = 'line-through';
    } else {
        document.getElementById(my_span).style.textDecoration = 'none';
    }
}

function volta(e) {
    if (OnEnter(e))
    {
        var p = document.getElementById('Foo');
        var filhos = p.childNodes;
        for (i = filhos.length - 1; i >= 0; i--) {
            if (filhos[i].tagName == 'LI') {
                p.appendChild(filhos[i]);
            }
        }

        var tarefa = document.getElementById("my_li").value;
        var li = document.createElement('li');
        p.appendChild(li);
        li.id = 'my_span' + j;
        li.innerHTML = "<input type='checkbox' id='ckb" + j + "' value='" + j + "' onclick='my_fun(" + j + ");'>" + tarefa;
        li.ondblclick = function () {
            li.innerHTML = "<input type='checkbox' id='ckb" + j + "' value='" + j + "' onclick='my_fun(" + j + ");'> <input id='tarefa' type='text' onkeypress='return my_li(event);' value='" + tarefa + "'>"
        };

        j++;

        return false;
    }
    else
    {
        return true;
    }
}
    </script>

</head>

<body>

        <form>
            <label for="ctarefa">Tarefas:</label> <input href="#" class="active" onkeypress="return recarrega(event);" type="text" id='my_span'><br />
            <div class="boxLista">
                <ul id="Foo">
                </ul>
            </div>
</form>

</body>

</html>
  1. Você vai ver essas setas em qualquer página de pergunta. Com elas, você pode dizer se uma pergunta ou uma resposta foram relevantes ou não.
  2. Edite sua pergunta ou resposta caso queira alterar ou adicionar detalhes.
  3. Caso haja alguma dúvida sobre a pergunta, adicione um comentário. O espaço de respostas deve ser utilizado apenas para responder a pergunta.
  4. Se o autor da pergunta marcar uma resposta como solucionada, esta marca aparecerá.
  5. Clique aqui para mais detalhes sobre o funcionamento do GUJ!

1 resposta

Não é a resposta que estava procurando? Procure outras perguntas com as tags javascript ou faça a sua própria pergunta.