Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

Aula 6

Gente, depois que criei a função de adicionar propagandas os meus botões pararam de funcionar e as propagandas não aparecem.

var atualizaDados = function(){
            var carrinhos = $(".carrinho");
            carrinhos.each(function(){
                var carrinho = $(this);
                var items = carrinho.find(".item-total:visible");
                var total = 0;
                for(var i=0; i < items.length; i++) {
                        var conteudo = $(items[i]).text();
                        var preco = parseFloat(conteudo);
                       total += preco;
                }
                carrinho.find(".valor-total").text(total);
                carrinho.find(".quantidade-de-itens").text(items.length);
            });
};
var removeItem = function(event){
    event.preventDefault(); 
    $(this).closest("tr").hide(); 

    atualizaDados();
};
var undo = function(){
            var carrinho = $(this).closest(".carrinho");
            carrinho.find("tr:visible").removeClass("recuperado");

            carrinho.find("tr:hidden").addClass("recuperado").show();
            atualizaDados()
};
var umaPropaganda = function(){
     var propagandas = ["O que acha de comprar uma motocicleta?",
               "O que acha de comprar uma lancha?",
               "O que acha de comprar uma bicicleta?",
               "O que acha de comprar uma carro?"
               ];
        var posicao = Math.floor(propagandas.length * Math.random());
        var texto - propagandas[posicao];
        var tr = $('<tr>').append($("<td>"));
        tr.find('td').text(texto);
        return tr;
};
var aposInicializado = function(){
    atualizaDados();
    $('.remove-item').click(removeItem);
    $(".undo").click(undo);
    $('.carrinho')each(function(){
        $('tr:nth-child(3n)').each(function(){
     umaPropaganda().insertAfter($(this))
});
    }
}
$(aposInicializado);
<html>
<head>
    <link rel="stylesheet" type="text/css" href="carrinho.css">
</head>
<body>
    <div class="carrinho">
        <h2>Carrinho entrega em Sao Paulo</h2>
        <table>
            <thead>
                <tr>
                    <td></td>
                    <td>Nome</td>
                    <td>Quantidade</td>
                    <td>Valor</td>
                    <td>Total</td>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td><img src="imagens/tablet.jpg"></td>
                    <td>Tablet miPad 18</td>
                    <td>1</td>
                    <td>499.99</td>
                    <td class="item-total">499.99</td>
                    <td><a class="remove-item" href="">(Remover)</td>
                </tr>
                <tr>
                    <td><img src="imagens/telefone.png"></td>
                    <td>Telefone miPhone 18</td>
                    <td>2</td>
                    <td>199.99</td>
                    <td class="item-total">399.98</td>
                    <td><a class="remove-item" href="">(Remover)</td>
                </tr>
                <tr>
                    <td><img src="imagens/sapato.jpg"></td>
                    <td>Sapato</td>
                    <td>1</td>
                    <td>99.99</td>
                    <td class="item-total">99.99</td>
                    <td><a class="remove-item" href="">(Remover)</td>
                </tr>
                <tr>
                    <td><img src="imagens/monitor.jpg"></td>
                    <td>Monitor Sam 21</td>
                    <td>1</td>
                    <td>299.00</td>
                    <td class="item-total">299.00</td>
                    <td><a class="remove-item" href="">(Remover)</td>
                </tr>
                <tr>
                    <td><img src="imagens/teclado.jpg"></td>
                    <td>Teclado com fio preto </td>
                    <td>1</td>
                    <td>100.00</td>
                    <td class="item-total">100.00</td>
                    <td><a class="remove-item" href="">(Remover)</td>
                </tr>
                <tr>
                    <td><img src="imagens/mouse.jpg"></td>
                    <td>Mouse wireless</td>
                    <td>1</td>
                    <td>199.00</td>
                    <td class="item-total">199.00</td>
                    <td><a class="remove-item" href="">(Remover)</td>
                </tr>
                <tr>
                    <td><img src="imagens/camiseta.jpg"></td>
                    <td>Camiseta G</td>
                    <td>1</td>
                    <td>25.00</td>
                    <td class="item-total">25.00</td>
                    <td><a class="remove-item" href="">(Remover)</td>
                </tr>
            </tbody>
        </table>
         <div>
             Valor total do carrinho:
             <span class="valor-total"></span>
             <br/>
             Quantidade de itens distintos:
             <span class="quantidade-de-itens"></span>
         </div>
         <div>
        <input type="button" value="Undo" class="undo">
        </div>

    </div>

    <div class="carrinho">
        <h2>Carrinho entrega em Vitoria</h2>
        <table>
            <thead>
                <tr>
                    <td></td>
                    <td>Nome</td>
                    <td>Quantidade</td>
                    <td>Valor</td>
                    <td>Total</td>
                    <td></td>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td><img src="imagens/camiseta.jpg"></td>
                    <td>Camiseta G</td>
                    <td>1</td>
                    <td>25.00</td>
                    <td class="item-total">25.00</td>
                    <td><a class="remove-item" href="">(remover)</a></td>
                </tr>
            </tbody>
        </table>
        <div>
            <input type="button" value="Undo" class="undo">
        </div>

        <div>
            Valor total: <span class="valor-total">0</span>
            <br/>
            Quantidade de itens: <span class="quantidade-de-itens">0</span>
        </div>
    </div>   

    <script src="jquery-2.0.3.min.js"></script>
    <script src="carrinho.js"></script>

</body>
4 respostas

percebi alguns erros no arquivo js, por isso estou postando de novo

var umaPropaganda = function(){
     var propagandas = ["O que acha de comprar uma motocicleta?",
               "O que acha de comprar uma lancha?",
               "O que acha de comprar uma bicicleta?",
               "O que acha de comprar uma carro?"
               ];
        var posicao = Math.floor(propagandas.length*Math.random());
        var texto = propagandas[posicao];
        var tr = $('<tr>').append($("<td>"));
        tr.find('td').text(texto);
        return tr;
};
var atualizaDados = function(){
            var carrinhos = $(".carrinho");
            carrinhos.each(function(){
                var carrinho = $(this);
                var items = carrinho.find(".item-total:visible");
                var total = 0;
                for(var i=0; i < items.length; i++) {
                        var conteudo = $(items[i]).text();
                        var preco = parseFloat(conteudo);
                       total += preco;
                }
                carrinho.find(".valor-total").text(total);
                carrinho.find(".quantidade-de-itens").text(items.length);
            });

};
var removeItem = function(event){
    event.preventDefault(); 
    $(this).closest("tr").hide(); 

    atualizaDados();
};

var undo = function(){
            var carrinho = $(this).closest(".carrinho");
            carrinho.find("tr:visible").removeClass("recuperado");

            carrinho.find("tr:hidden").addClass("recuperado").show();
            atualizaDados()
};
var aposInicializado = function(){
    atualizaDados();
    $('.remove-item').click(removeItem);
    $(".undo").click(undo);
    $('.carrinho')each(function(){
        $('tr: nth-child (3n)').each(function(){
        umaPropaganda().insertAfter($(this));
        });
    });
};
$(aposInicializado);
solução!

Oi Patricia! Como vai?

Se estiver utilizando o Google Chrome para testar o seu sistema, vá até o console do painel de desenvolvedor (F12) e veja se há algum erro sendo lançado ao carregar a página e depois de executadas as ações.

De posse dessas informações ficará mais fácil identificar o que está acontecendo.

Muito obrigada, todo o problema era um ponto que estava faltando ¬¬

Por nada, Patricia!

Relaxa, esse problema de "faltando um ponto e vírgula" acontece com os melhores!

Mas, a dica é: sempre que tiver problemas no funcionamento do seu javascript, use o painel do desenvolvedor que ele será uma mão na roda pra vc!

Bons estudos!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software