When I double javascript code stops working

Question

When I double javascript code stops working

Navigation

#1 by (0 votes)

-1

I have a script with jquery inside my page that changes the values of my table, but when I copy and paste to apply it to another table the first one stops working:

<div class="container">
        <div class = "row">
            <div class="col-md-6">
                <div class="row">                   
                    <div class="container">
                            **<script type="text/javascript">
                                function cargar() {
                                  var celdas = document.getElementById("target0").getElementsByTagName("td");
                                  for(var i=0; i<celdas.length; i++) {
                                    if(celdas.item(i).textContent <=0) {
                                      celdas.item(i).style.color = "#F00";
                                    }
                                  }
                                }
                                window.onload = cargar;
                            </script>**

                        <table id="target0" class="table table-striped table-bordered">
                            <tr>
                                <th>Region</th>
                                <th>Mes Actual</th>
                                <th>% var M2M</th>
                                <th>% var Y2Y</th>
                            </tr>
                            <?php
                            $rp_ejecutar = sqlsrv_query($t_p_conn_sis, $rp_consulta);

                            $rp_i = 0;

                            while($rp_fila = sqlsrv_fetch_array($rp_ejecutar)){
                                $rp_Region = $rp_fila["REGION"];
                                $rp_Mes_Actual = $rp_fila["r_Mes_Actual"];
                                $rp_Mes_Anterior = $rp_fila["r_Mes_Anterior"];
                                $rp_Mes_Ao_Anterior = $rp_fila["r_Mes_Ao_Anterior"];
                                $rp_i++;
                                $rm2m =($rp_Mes_Actual/$rp_Mes_Anterior-1)*100;
                                $ry2y =($rp_Mes_Actual/$rp_Mes_Ao_Anterior-1)*100; 
                                ?>   
                            <tr align="center">
                                <td><?php echo $rp_Region;?></td>
                                <td><?php echo $rp_Mes_Actual;?></td>                              
                                <td><?php printf("%.1f",$rm2m)?></td>
                                <td><?php printf("%.1f",$ry2y)?></td>
                            </tr>
                            <?php } ?>                           
                        </table>                        
                    </div>                  
                </div>              
            </div>    
        </div>
    </div>


<div id="div1">
            <script type="text/javascript">
                                function cargar() {
                                  var celdas = document.getElementById("target1").getElementsByTagName("td");
                                  for(var i=0; i<celdas.length; i++) {
                                    if(celdas.item(i).textContent <=0) {
                                      celdas.item(i).style.color = "#F00";
                                    }
                                  }
                                }

                                window.onload = cargar;
                            </script>


            <table id="target1" class="table table-striped table-bordered">
                <tr>
                    <!-- <th>Region</th> -->
                    <th>Agencia</th>
                    <th>Mes Actual</th>
                    <th>% var M2M</th>
                    <th>% var Y2Y</th>
                </tr>
                <?php
                $ap_ejecutar = sqlsrv_query($t_p_conn_sis, $ap_consulta);

                $ap_i = 0;

                while($ap_fila = sqlsrv_fetch_array($ap_ejecutar)){
                    $ap_Region = $ap_fila["REGION"];
                    $ap_Agencia = $ap_fila["AGENCIA"];
                    $ap_Mes_Actual = $ap_fila["a_Mes_Actual"];
                    $ap_Mes_Anterior = $ap_fila["a_Mes_Anterior"];
                    $ap_Mes_Ao_Anterior = $ap_fila["a_Mes_Ao_Anterior"];
                    $ap_i++; 
                    ?>   
                <tr align="center">
                    <!-- <td><?php echo $ap_Region;?></td> -->
                    <td><?php echo $ap_Agencia;?></td>
                    <td><?php echo $ap_Mes_Actual;?></td>
                    <td><?php printf("%.1f",(($ap_Mes_Actual/$ap_Mes_Anterior-1)*100))?></td>
                    <td><?php printf("%.1f",(($ap_Mes_Actual/$ap_Mes_Ao_Anterior-1)*100))?></td>
                </tr>
                <?php } ?>
            </table>
        </div>

javascript

asked by Ronald Martinez 17.10.2018 в 02:15

source

1 answer

Concatenate a constant of typescript to an url address in html using src Problem BASH script linux

score 0 · Answer 1

Your Javascript block what it does is define a global function called " load ". And when duplicating it, the second block overwrites the function defined in the first block, since both have the same name ( load ).

What you can do is modify the first block in this way:

window.addEventListener('load', function () {
    var celdas = document.getElementById("target0").getElementsByTagName("td");
    for(var i=0; i<celdas.length; i++) {
        if(celdas.item(i).textContent <=0) {
            celdas.item(i).style.color = "#F00";
        }
    }
});

And the second block:

window.addEventListener('load', function () {
    var celdas = document.getElementById("target1").getElementsByTagName("td");
    for(var i=0; i<celdas.length; i++) {
        if(celdas.item(i).textContent <=0) {
            celdas.item(i).style.color = "#F00";
        }
    }
});