Foros del Web » Creando para Internet » HTML »

Mantener estado botón con localstorage

Estas en el tema de Mantener estado botón con localstorage en el foro de HTML en Foros del Web. Hola a todos, Voy a plantear un problema que tengo a ver si algún alma caritativa me puede echar un cable. He creado un sistema ...
  #1 (permalink)  
Antiguo 03/03/2016, 05:40
 
Fecha de Ingreso: marzo-2016
Mensajes: 1
Antigüedad: 3 años, 8 meses
Puntos: 0
Mantener estado botón con localstorage

Hola a todos,
Voy a plantear un problema que tengo a ver si algún alma caritativa me puede echar un cable.

He creado un sistema de favoritos con localstorage y jquery para que al guardar un favorito, éste se conserve incluso cuando el usuario ha cerrado el navegador. El problema viene porque quiero deshabilitar el botón de crear favorito cuando éste se haya creado para no crear el mismo favorito más de una vez y recuperar el estado inicial del botón cuando se elimina el favorito.

Os pongo el código que seguro lo vais a entender mejor:

Código:
<html>
<head>

<title>Marcadores</title>

<script src="js/jquery-1.11.3.js" type="text/javascript"></script>
<script src="js/jquery-1.11.3.min.js" type="text/javascript"></script>



<script>
$(document).ready(function() {
  var $ul = $('#bookmarks');

  //get items from local storage
  if(localStorage.getItem('links')){
   $ul.html(localStorage.getItem('links'));
  }

  $('#cita01').click(function () {
    $('#bookmarks').append('<li><a href="#">Esta es la cita número 1</a><button class="eliminar01">remove</button></li>');
    localStorage.setItem('links', $ul.html());
    $("#cita01").attr('disabled', true);
  });


  //remove item
  $("#bookmarks").on('click','.eliminar01',function () {
      if (confirm("¿Estás seguro de eliminar este favorito?")) {
        $(this).parent().remove();
        //save changes to localstorage
        localStorage.setItem('links', $ul.html());

        $("#cita01").attr('disabled', false);
    }   
    return false;
  });
});
</script>


<style>
#cita01{
    width: 60px;
    height: 40px;
    background: green;
}

.eliminar01{
    width: 60px;
    height: 40px;
    background: red;
}

</style>

</head>

<body>

<div class="wrapp">

    <h1>Bookmarks</h1>
    <ul id="bookmarks"></ul>
    </div>

    <div id="grupo">
        <h1>Quotes</h1>

        <div class="quote">
            <p>L isjf sldzh valshlsah akuhcEbitat ut la soluptatem re sequae nis commodit re volori res atium aliquunt utas apediti qui tetus cus, consedi ctotatem quod es mollabo restibe rchiti ressit hiti officie nimolup.</p>
        <button id="cita01">Add</button>
        </div>

 </div>
</body>
</html>
Como veis, he usado
Código:
$("#cita01").attr('disabled', true);
y
Código:
$("#cita01").attr('disabled', false);
pero no me funciona porque al cerrar el navegador y volverlo a abrir, el botón queda habilitado aunque se mantenga el favorito; es decir, no se guarda el estado del botón (disabled) en localstorage.

Muchas gracias!!!
  #2 (permalink)  
Antiguo 07/03/2016, 15:57
 
Fecha de Ingreso: octubre-2015
Mensajes: 13
Antigüedad: 4 años
Puntos: 1
Respuesta: Mantener estado botón con localstorage

Esto no deberia ir en javascript?

Etiquetas: estado, javascript, localstorage, text, todo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 14:08.