0

tengo una tabla en html, pero deseo seleccionar solo la fila y cuando de clic cambie de color y que se quede seleccionado cuando recargue o cambie de página, alguien puede ayudarme? Adjunto el código que tengo.

$(function() {
  $('tr').click(function(e) {
    if ($(this).hasClass('row-selected')) {
      $(this).addClass('other-clic')
    } else {
      cleanTr()
      $(this).addClass('row-selected')
    }
  })

  function cleanTr() {
    $('.row-selected').each(function(index, element) {
      $(element).removeClass('row-selected')
      $(element).removeClass('other-clic')
    })
  }
})



.row-selected {
  background: yellow;
}

tr {
  cursor: pointer;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="default">
  <thead>
    <th>Proyecto</th>
    <th>N1</th>
    <th>N2</th>
    <th>N3</th>
  </thead>
  <tbody>
    <tr>
      <th>APROBADOS</th>
      <th>0</th>
      <th>0</th>
      <th>0</th>
    </tr>
    <tr>
      <th>RECHAZADOS</th>
      <th>0</th>
      <th>0</th>
      <th>0</th>
    </tr>
    <tr>
      <th>EN ANÁLISIS</th>
      <th>0</th>
      <th>0</th>
      <th>0</th>
    </tr>
    <tr>
      <th>EN ESPERA</th>
      <th>0</th>
      <th>0</th>
      <th>0</th>
    </tr>
    <tr>
      <th>TOTAL</th>
      <th>0</th>
      <th>0</th>
      <th>0</th>
    </tr>
  </tbody>
</table>
2
  • Hola intenta redactar mejor tu pregunta para que recibas ayuda, te recomiendo leer Como Preguntar para que tengas mas ayuda
    – Trapss
    el 23 sep. 2021 a las 5:09
  • Te recomiendo usar Cookies ahi hay un ejemplo crea una cookie 1 y luego recarga la pagina y muestra tus cookies veras que aun sigue la cookie 1
    – Trapss
    el 23 sep. 2021 a las 5:13

1 respuesta 1

1

Es imposible guardar estados en HTML + CSS + JS sin usar cookies o algun tipo de storage. Echa un vistazo a https://developer.mozilla.org/es/docs/Web/API/Window/localStorage.

El tema sería en el mismo momento que cambias el color de la fila, guardas el indice de la fila en el storage i cada vez que cargas la página, compruebas si existe en el storage el indice y por lo tanto, pintas la fila.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.