0

我真的不明白这一点。在我的 JavaScript 示例中,我试图用 CSS 隐藏三个按钮,但什么也没发生!为什么李二和李三不躲?我想让 li.two 和 li.three 在单击它们的按钮之前不可见。(Yahoo 仅在单击 Google 时可见,Facebook 仅在单击 Yahoo 时可见)这是代码:

<html>
<head>
<script type="text/javascript">
function show_prompt()
{
var name=prompt("Your Name");
if (name!=null && name!="")
  {
  alert("Thanks for clicking " + name + "!");
  window.open("http://www.google.com/};
}
</script>
<script type="text/javascript">
function show_alert()
{
alert("Thanks for clicking me!");
window.open("http://www.yahoo.com/");
}
</script>
<script type="text/javascript">
function show_alert1()
{
alert("Have fun on Facebook!");
window.open("http://www.facebook.com/");
}
</script>
<script type="css/text">
li.two, li.three {display:none};
</script>
</head>
<body>
<ul>
<li class="one"><input type="button" onclick="show_prompt();showNext('Yahoo')" value="Google" />
<li class="two"><input type="button" id="Yahoo" onclick="show_alert();showNext('Facebook')" value="Yahoo" />
<li class="three"><input type="button" id="Facebook" onclick="show_alert1()"value="Facebook" />
</ul>
</body>
</html>
4

3 回答 3

2

您没有结束标签<li>

<li class="one"><input type="button" onclick="show_prompt();showNext('Yahoo')" value="Google" /></li>
<li class="two"><input type="button" id="Yahoo" onclick="show_alert();showNext('Facebook')" value="Yahoo" /></li>
<li class="three"><input type="button" id="Facebook" onclick="show_alert1()"value="Facebook" /></li>

你的CSS是错误的,;在外面{}

li.two, li.three {display:none;}

你的css在一个<script>标签中,需要在里面:

<style type="text/css">li.two, li.three {display:none;}</style>

于 2012-04-12T12:17:17.197 回答
1

你需要使用这个

<li class="one"><input type="button" onclick="show_prompt();showNext('Yahoo')" value="Google" />
<li class="two"><input type="hidden" type="button" id="Yahoo" onclick="show_alert();showNext('Facebook')" value="Yahoo" />
<li class="three"><input type="hidden" type="button" id="Facebook" onclick="show_alert1()"value="Facebook" />
于 2012-04-12T12:39:48.853 回答
0

你没有关闭 li 标签,你的 showNext() 函数只调用,没有写那个函数

尝试这个

        <html>
        <head>
        <style type="text/css">
        .two,.three{
        display:none;
        }
        </style>


        <script type="text/javascript">
        function show_prompt()
        {
        var name=prompt("Your Name");
        if (name!=null && name!="")
          {
          alert("Thanks for clicking " + name + "!");
          window.open("http://www.google.com/")

          };
        }
        </script>
        <script type="text/javascript">
        function showNext(value){

        document.getElementById(value).style.display="block";





        }
        </script>
        <script type="text/javascript">
        function show_alert()
        {
        alert("Thanks for clicking me!");
        window.open("http://www.yahoo.com/");
        }
        </script>
        <script type="text/javascript">
        function show_alert1()
        {
        alert("Have fun on Facebook!");
        window.open("http://www.facebook.com/");
        }
        </script>

        </head>
        <body>
        <ul>
        <li class="one"><input type="button" onclick="show_prompt();showNext('Yahoo')" value="Google" /></li>
        <li class="two" id="Yahoo" ><input type="button" id="Yahoo" onclick="show_alert();showNext('Facebook')" value="Yahoo" /></li>
        <li class="three" id="Facebook"><input type="button" id="Facebook" onclick="show_alert1()"value="Facebook" /></li>
        </ul>
        </body>
        </html>
于 2012-04-12T13:36:14.240 回答