2

Estou tentando fazer o seguinte: na tela tem que aparecer de 0 a 36, no momento em que eu clicar em algum dos números o valor que estiver na frente dele tem que zerar. E ao mesmo tempo na frente de todos os outro números somar +1 ao valor que estiver. E assim por diante a cada clique em algum dos números vá se alterando os valores. Mas travei neste código:

<table border="1">
      <?php

       $linha1 = array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18);
       $linha2 = array(19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36);

       $tabela = array($linha1, $linha2);
       for ($i =0 ; $i < 19; $i++)
       {
            echo "<tr>";

            for ($j =0 ; $j < 18; $i++)
            {
                echo "<td>valor</td>";
            }
        echo "</tr>;
       }
      ?>
</table>
1
  • 2
    Porque não está usando $tabela nem nenhuma $linha? Se tem que interagir com o clique precisa de JavaScript/jQuery, porque não tentou nada com isso?
    – brasofilo
    Commented 24/06/2014 às 4:20

1 Resposta 1

2

Tem alguns erros no seu PHP, para além de não estar muito claro o que pretende.

Mas corrigindo o seu PHP, o código fica asssim (repare os comentários no código):

Lado servidor:

<table border="1">
      <?php

       $linha1 = array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18);
       $linha2 = array(19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36);

       $tabela = array($linha1, $linha2);
       for ($i =0 ; $i < count($tabela); $i++){ // usar o tamanho da $tabela

            echo "<tr>";
            $estaLinha = $tabela[$i]; // só para clarificar

            for ($j =0 ; $j < 18; $j++){ // aqui tinha `$i++` e deve ser `$j++`
                echo "<td>".$estaLinha[$j]."</td>"; // em vez da palavra "valor" colocar o valor da array
            }
        echo "</tr>";
       }
      ?>
</table>

Agora com este código correto o HTML resultante é este:

<table border="1">   
    <tbody>
        <tr>         
            <td>0</td><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td><td>9</td><td>10</td><td>11</td><td>12</td><td>13</td><td>14</td><td>15</td><td>16</td><td>17</td>         
        </tr>      
        <tr>       
            <td>19</td><td>20</td><td>21</td><td>22</td><td>23</td><td>24</td><td>25</td><td>26</td><td>27</td><td>28</td><td>29</td><td>30</td><td>31</td><td>32</td><td>33</td><td>34</td><td>35</td><td>36</td>        
        </tr>
    </tbody>
</table>

Com essa tabela, pode usar este JavaScript/jQuery:

$('table td').on('click', function () {       // oscultador de clic
    $(this).nextAll().each(function (i) {     // procurar os seguintes `<td>` com o método `.nextAll()` e percorrer um a um
        this.innerHTML = parseInt(this.innerHTML, 10) + 1; // adicionar +1 a cada um
        if (i == 0) this.innerHTML = 0;                    // tratar a excepção que é o primeiro imediatamente a seguir, verificando o index (`i`) a função .each() passa
    });
});

Exemplo online: http://jsfiddle.net/mH2u7/


EDIT:

Reparei agoa que não tinha marcado jQuery como tag, assim se quiser fazer o mesmo só usando javascript puro, pode fazer assim: (http://jsfiddle.net/n9LTQ/)

var celulas = document.querySelectorAll('table tr td');
for (var i = 0; i < celulas.length; i++) {
    celulas[i].addEventListener('click', mudarValor);
}

function mudarValor(e) {
    var este = e.target;
    var verificador = 0;
    for (var i = 0; i < celulas.length; i++) {
        if (este == celulas[i]) {
            var proximo = este.nextElementSibling;
            proximo.innerHTML = 0;
            while (proximo) {
                proximo = proximo.nextElementSibling;
                if (proximo) proximo.innerHTML = parseInt(proximo.innerHTML, 10) + 1;
            }
        }
    }
}
15
  • muito obrigado a todos pela ajuda:)
    – user11748
    Commented 24/06/2014 às 15:27
  • Só um probleminha eu clico ele zerou e todos os outro somar +1 mas ao clicar em outro numero quem foi zerado tem que aparecer 1 agora. desculpe pelo incomodo quando poder se poder é claro muito obg
    – user11748
    Commented 24/06/2014 às 16:19
  • onde estão os "0" que ficam abaixo dos números o numero que eu clicar todos os outros zeros somam 1 e onde eu cliquei se tiver algum valor na caixinha que fica embaixo ele zera jsfiddle.net/n9LTQ/1
    – user11748
    Commented 24/06/2014 às 16:41
  • @user11748 você quer que os numeros somem também em linha diferente? ou só na mesma linha?
    – Sergio
    Commented 24/06/2014 às 16:43
  • 1
    Muitíssimo obrigado Sergio, vou salvar cada parte para poder acessar no hostlocal tenha uma boa noite e desculpe pela dor de cabeça que causei :)
    – user11748
    Commented 24/06/2014 às 21:26

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .