2016-03-03 63 views
-2

我試圖用本地存儲和jq禁用(即使用戶關閉或刷新瀏覽器時)按鈕,但我一直無法做到... 我設法創建了一個永久最喜歡的名單,但我想要的是禁用創建新的喜愛,當這個已經創建的選項。Mantain按鈕被Localstorage和jquery禁用

這裏是我的代碼:

<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> 

我相信這個問題是在這裏:$("#cita01").attr('disabled', false);


任何人都可以幫我這個問題? 非常感謝你提前!

回答

0

正如你猜測的那樣,這是對的。更改如下:

$("#cita01").attr('disabled', false); 

要:

$("#cita01").removeAttr('disabled'); // or 
$("#cita01").prop('disabled', false); 

.attr()僅用於設置的值。它仍然設置disabled="false",但瀏覽器將其呈現爲禁用狀態。您必須使用新的.prop()並設置false,否則您應該使用舊的.removeAttr()

快速修復:將所有.attr()替換爲.prop()