javascript - Javascript竖起大拇指/向下

Question

我有以下 javascript，它链接到拇指向上和向下拇指按钮。当每个都单击另一个关闭。这完美地工作。但是本地存储部分没有

目前，当我刷新页面时，两个按钮都“打开”（它们的活动状态颜色）我试图使用 removeItem 以便在按下按钮时忘记另一个按钮的本地存储并且它不会显示。然而，他们仍然是一个。

有任何想法吗

更新; 更改为 ThumbStatus

function thumbsup(){

    document.getElementById("thumbsup").classList.remove("btn-default")
    document.getElementById("thumbsup").classList.add("btn-success")    
    document.getElementById("thumbsdown").classList.remove("btn-danger")
    document.getElementById("thumbsdown").classList.add("btn-default")

  localStorage.setItem('ThumbStatus',up);
  localStorage.removeItem('ThumbStatus', down);
  }



  function thumbsdown(){

    document.getElementById("thumbsdown").classList.remove("btn-default")
    document.getElementById("thumbsdown").classList.add("btn-danger")   
    document.getElementById("thumbsup").classList.remove("btn-success")
    document.getElementById("thumbsup").classList.add("btn-default")

  localStorage.setItem('ThumbStatus',down);
  localStorage.removeItem('ThumbStatus', up);
  }





function Loadthumbs1() {
   //if something was already saved....
  if ( localStorage.getItem('ThumbStatus', up) ) 
  {
  var up = localStorage.getItem('ThumbStatus', up);

   }


document.getElementById("thumbsup").classList.add("btn-success")

 }
function Loadthumbs2() {        
if ( localStorage.getItem('ThumbStatus', down) ) {
var down = localStorage.getItem('ThumbStatus', down);
}

document.getElementById("thumbsdown").classList.add("btn-danger")



}

Answer 1

var tu = document.getElementById("thumbsup");
var td = document.getElementById("thumbsdown");
var thumbStatus = localStorage.getItem('ThumbStatus');

function thumbsup() {
  tu.classList.remove("btn-default");
  tu.classList.add("btn-success");    
  td.classList.remove("btn-danger");
  td.classList.add("btn-default");
  localStorage.setItem('ThumbStatus', 'up');
 }

function thumbsdown() {
  td.classList.remove("btn-default");
  td.classList.add("btn-danger");   
  tu.classList.remove("btn-success");
  tu.classList.add("btn-default");
  localStorage.setItem('ThumbStatus', 'down');
 }

function Loadthumbs() {
  if (thumbStatus && thumbStatus === 'up' ) {
   thumbsup();
  }
  if (thumbStatus && thumbStatus === 'down' ) {
   thumbsdown();
  }
 }