JavaScriptはプロパティ値を変更しません

Question

私はIEを使用しており、Visual Studioを使用してWebフォームを作成しています。

私が作成したトーストのスタイルの価値を変えようとしています。

トーストHTMLはここから取られる：http://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_snackbar

私のhtmlコード：

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication4._Default" %> 

<asp:Content runat="server" ID="FeaturedContent" ContentPlaceHolderID="FeaturedContent"> 

<link rel="stylesheet" href="/Styles/snakebar.css" type="text/css" /> 


<style type="text/css"> 
    #s3 { 
     display: none; 
    } 

    .s { 
     display: none; 
    } 

    .s2 { 
     display: compact; 
    } 
</style> 

<button onclick="myFunction()">CLICKER</button> 
<div id="snackbar" class="show"> 
    Some text some message.. 
    <%-- <asp:Label runat="server" Text="Some text some message.."></asp:Label>--%> 



<script> 

    function myFunction() { 

     var x = document.getElementById("snackbar"); 
     if (x != null) { 

      if (document.getElementById("snackbar").style.visibility == "hidden") { 

       try { 
        document.getElementById("snackbar").style.visibility = "hidden"; 
        // document.getElementById("snackbar").className.replace("show", "s"); 
        // document.getElementById("snackbar").className.value = "s3"; 
       } 
       catch (ex) { 
        alert(ex); 
       } 
      } else { 
       document.getElementById("snackbar").style.visibility = "visible"; 
       document.getElementById("snackbar").className.value = "show"; 
       window.onload = function() { 

        document.getElementById("snackbar").style.visibility = "visible"; 
       } 
      } 

     } 
    } 
</script> 

私は常に見える "style.visibleの代わりに」" を取得ボタンを押すと"または隠されています。 アイデア？ありがとうございました！

Answer 1

は、私はあなたがこれを行うためのものと思う：

window.onload = function() { 
 
    document.getElementById("snackbar").style.visibility = "visible"; 
 

 
    document.getElementById("but").onclick = function() { 
 
    var x = document.getElementById("snackbar"); 
 
    if (x != null) { 
 
     var vis = x.style.visibility; 
 
     x.style.visibility = vis == "" || vis == "visible" ? "hidden" : "visible" 
 
    } 
 
    } 
 
}

<button id="but" type="button">CLICKER</button> 
 
<div id="snackbar" class="show"> 
 
    Some text some message.. 
 
</div>