电话号码和邮箱 编辑和取消 问题

直接点击取消时，电话号码和邮箱没有变化。点击编辑后，变为输入框，如果不想编辑了，再点击取消，内容恢复原样。

//编辑
function edit(){
     //phone,email 变量声明时没有使用var,是全局变量，因为下面的cancel()函数要用到
     phone = $("#phone").text();
     email = $("#email").text();
    $("#phone").html("");
     $("#email").html("");               
}
//取消
function cancel(){
   //如果直接点击取消，则内容不变，typeof phone=="object"
   //如果点击编辑后在再点击取消，typeof phone=="string"  , 既 typeof phone != "object"
    var cancelPhone = $("#phone").text();
    var cancelEmail = $("#email").text();
    if(typeof phone =="object"){
      $("#phone").html(cancelPhone);
      $("#email").html(cancelEmail);
    }else{
      $("#phone").html(phone);
      $("#email").html(email);
    }

}

  电话
  
${user.phone }
     


  邮箱
  
${user.email }
     

  取消

 

 
   编辑

 

1.直接点击取消，内容没有变化

2.点击编辑，电话和邮箱变为输入框。

3.忽然不想编辑了，点击取消后，内容恢复原样。