How to make an event only load once javascript

Question

How to make an event only load once javascript

Navigation

#1 by (3 votes)
#2 by (0 votes)
#3 by (0 votes)

1

Hi, I'm doing a web with jquery and c #.

The problem I have is that when I click on menus on the web more than once, I think the html content of the page is being loaded again and again. With this, clicking on the menu repeats the click () event and clicks 2 times.

I would like to know how I can delete the previous script when loading the same html page again so that it does not end the page with the same script many times. Thanks.

The complete code is the following: Top Menu

          $(function () {
                $("[id*='gestion_polizas']").click(function () {
                    $("[id*='leftWrapper']").hide();

                    $("[id*='contenido']").load("Polizas/gridPolizas.aspx");
                    //$("[id*='leftWrapper']").load("Recibos/menuLateral_recibos.aspx");

                    //por si tarda al cargar cuando se pulsa el boton
                    //$("[id*='contenido']").load("Cargando.aspx");
                    //setTimeout($("[id*='contenido']").load("JqGridInformatica.aspx"), 2000);
                });
            })

When clicking on a row in the grid (opens the side menu)

   onSelectRow: function (row_id) {

                          //hago un hide en el formulario anterior para crear el efecto
                          //de cargar e la izquiera de nuevo
                          $("#div_formularioPolizas").hide();

                          //llamo a la funcion que le da datos al formulario a partir del key del jqgrid
                          rellenar_formulario(row_id);
                          //cargo el menu lateral
                          $("[id*='leftWrapperPolizas']").load("Polizas/menuLateral_polizas.aspx");
                          //muestor el menu lateral con efecto
                          $("[id*='leftWrapperPolizas']").show(1000);

Side menu that opens when you click on a grid row

        <body>
<div id="menuPolizass">
<div id="listView" class="list listView">
            <li class="<%--list-item-active--%>"><a href="#" id="menuLateral_cliente" class='target listView'>Cliente</a></li>
            <li><a href="#" id="menuLateralPolizas_recibos" class='target listView'>Recibos</a></li>
            <li><a href="#" id="menuLateralPolizas_siniestros" class='target listView'>Siniestros</a></li>
            <li><a href="#" id="menuLateralPolizas_tarificacion" class='target listView'>Tarificación</a></li>
            <li><a href="#" id="menuLateralPolizas_imprimir" class='target listView'>Imprimir</a></li>

        </div>
<div id="flotantePolizas"></div>

      function funciones_MenuLateral() {

      $("#menuLateralPolizas_recibos").unbind("click");
          $("#menuLateralPolizas_recibos").click( function () {
              if ($("#jqGridRecibos").length == 0) {
                  $("[id*='flotantePolizas']").load("Recibos/gridRecibos.aspx");


                  $("[id*='flotantePolizas']").dialog({
                      width: 1200,
                      height: 800,
                      beforeClose: function (event, ui) {
                          //al cerrar el dialog borro el jqgrid para que no haya error al volverlo a abrir
                          alert("cerrado");
                          $("#jqGridRecibos").remove();

                      }
                  }).dialogExtend({
                      "closable": true,
                      "maximizable": false,
                      "minimizable": true,
                      "collapsable": true,

                  });

                  //return false;
                  $("[id*='menuLateralPolizas_recibos']").attr('id', 'NEWID');

              }
              else {
                  alert("Esta ventana ya esta abierta");
              }
          });


  }
  funciones_MenuLateral();

javascript jquery

asked by wuasaa 17.03.2017 в 15:53

source

3 answers

0

The best thing would be if you did not bindate the event on that element twice, but well, if necessary, you could do the following:

$( "#foo").unbind( "click" ).click(function (){
 //Tu código
});

This will cause that when bindear the event click on the element, the one that previously existed will be removed before bindear the new one.

answered by 17.03.2017 в 16:13

0

Ok, so I just solved it, it was not a problem that the click event was loaded twice, the problem was that it reloaded the divflotante and gave error. What I've done is make a # divflotante.remove each once I call the function functionsmenralral () and so it works correctly

answered by 17.03.2017 в 16:41

Text handling in Java views How to define a non-incremental primary key in Laravel 5?

score 3 · Accepted Answer

Hello I see that you use jQuery, in this case the solution is very easy, due to the length of your code I will give you the example but the solution is the same using

.one() //de jQuery

$("#menu").one("click", function (){
     //esto solo se ejecuta la primera vez que das click en el elemento con el id menu
     alert("abrir menu");
 });

#menu{
  background: #000;
  color: #fff;
  min-width: 70px;
  width: 70px;
  min-height:30px;
  max-height: 100%;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="menu">
    
</div>

My snippet what it does is simple, you click and only for the first time will launch an alert, What you will do is change your code every time you add the event click only in the places you want this to be executed once , Example:

$("[id*='gestion_polizas']").click(function () {

This is changed to:

$("[id*='gestion_polizas']").one("click",function () {