html 如何在使用if语句后隐藏对象[关闭]

6qfn3psc 于 2023-11-15 发布在其他

关注(0)|答案(1)|浏览(145)

已关闭。此问题需要details or clarity。目前不接受回答。
**要改进此问题吗？**通过editing this post添加详细信息并阐明问题。

6天前关闭
Improve this question的
因此，我试图使一个项目消失时，以往任何时候的本地存储carted = 2和存储确实工作，我总是只是得到一个错误时，试图隐藏和对象，我会apreciate任何帮助，因为这是为学校谢谢，我真的需要解决这个问题，任何帮助是apreciated

<html>
  <link rel="stylesheet" href="style.css">
  
  <Head>
    <title> Clear Shop | cart
    </title>
    <link rel="icon" type="image/x-icon" href="fav.png">
    <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500&display=swap" rel="stylesheet">
  </Head>
 
  
  
  
  
    <style>
      ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
        overflow: hidden;
        background-color: #489FB5;
      }
      
      li {
        float: left;
      }
      
      li a {
        display: block;
        color: white;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
      }
      
      li a:hover  { 
        background-color: #1D4049;
        border: none;
     color: white;
     text-align: center;
     opacity: 0.6;
     transition: 0.8s;
     
      }
      
      </style>
      </head>
      <body>
        <script>
          
          var Carted;
          var mycart = document.getElementById('Itemincart');
          
          Carted = localStorage.getItem('Carted')
          if (Carted == 2) {
            mycart.style.display = 'none';
            
            
            console.log("hidden");
            
            
            
           
            
            }
         
       
       
          
        
          
          
         
           
         
          function Addtocart() {
            if (Carted == 2) {
            
            console.log("hidden");
            mycart.style.display = 'none';
            
           
            
            }
            
            
            console.log("Unadded");
            Carted = 2;
            localStorage.setItem('Carted',Carted);
            
            
            
           
            
            
          }
        
          
             
          
        
          
          </script>
          
      
      <ul>
        <li class="pfp"><a href="#pfp"> <img src="pfp.jpg" alt="pfp" width="50" 
          height="50"></a></li>
          <li class="cart"><a href="cart.html"> <img src="cart.png" alt="cart" width="50" 
            height="50"></a></li>
          
        <li class="Home"><a class="active" href="home.html">CLEAR SHOP</a></li>
        <li class="shop"><a href="shop.html">Shop</a></li>
      
        <li class="cont"><a href="contact.html">Contact</a></li>
        <li class="about"><a href="about.html">About</a></li>
        
      </ul>
      <div id="Itemincart">
        <p class="boxtext"id="rcorners1">Item<br><p2 style="font-size: 15;">$100</p2> <button onclick="Addtocart()">X </button></p>
      </div>
       
      
      
      
  
  
</h1>
 
</html>

字符串
mycart.style.display = 'none';根本不起作用

Html

来源：https://stackoverflow.com/questions/77442302/how-to-hide-a-object-after-using-a-if-statment

1条答案

按热度按时间

bgtovc5b1#

你关于var mycard的声明是get a Element that doesn't exists，脚本页面是程序化的，所以试着把你的js脚本放在元素后面.试试：

<html>
  <link rel="stylesheet" href="style.css">
  
  <Head>
    <title> Clear Shop | cart
    </title>
    <link rel="icon" type="image/x-icon" href="fav.png">
    <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500&display=swap" rel="stylesheet">
 
    <style>
      ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
        overflow: hidden;
        background-color: #489FB5;
      }
      
      li {
        float: left;
      }
      
      li a {
        display: block;
        color: white;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
      }
      
      li a:hover  { 
        background-color: #1D4049;
        border: none;
     color: white;
     text-align: center;
     opacity: 0.6;
     transition: 0.8s;
     
      }
      
      </style>
      </head>
      <body>
      
      <ul>
        <li class="pfp"><a href="#pfp"> <img src="pfp.jpg" alt="pfp" width="50" 
          height="50"></a></li>
          <li class="cart"><a href="cart.html"> <img src="cart.png" alt="cart" width="50" 
            height="50"></a></li>
          
        <li class="Home"><a class="active" href="home.html">CLEAR SHOP</a></li>
        <li class="shop"><a href="shop.html">Shop</a></li>
      
        <li class="cont"><a href="contact.html">Contact</a></li>
        <li class="about"><a href="about.html">About</a></li>
        
      </ul>
      <div id="Itemincart">
        <p class="boxtext"id="rcorners1">Item<br><p2 style="font-size: 15;">$100</p2> <button onclick="Addtocart()">X </button></p>
      </div>
<script>
  var mycart = document.getElementById('Itemincart');
  Carted = localStorage.getItem('Carted')
  if (Carted === 2) {
    mycart.style.display = 'none';
    console.log("hidden 1");
  }
  function Addtocart() {
    if (Carted === 2) {
      console.log("hidden 2");
      mycart.style.display = 'none';
    }
    console.log("Unadded");
    Carted = 2;
    localStorage.setItem('Carted',Carted);
  }
  </script>
</body>
</html>

字符串
别忘了，JS中的比较，用=

展开查看全部

赞(0）回复(0）举报 2023-11-15

我来回答

html 如何在使用if语句后隐藏对象[关闭]

1条答案

相关问题

热门标签

最新问答