的HTML

Question

任何人都可以帮我解决这个问题吗？我是新用的CSS / HTML。我想创建一个链接div来隐藏和显示其内容。我做错了什么？

这是我的代码：

的HTML

<a href="#" id="hideShow">My Title</a>
<div id="message" style="visibility:hidden; border: 1px solid #777; width: 400px; padding: 1%;">
    Blah Blah Blah Blah
</div>


<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript"> 

    $("#hide").toggle(
        function(){$("#message").show();},
        function(){$("#message").hide();},
});

</script>

...谢谢

Answer 1

试试这个，

$("#hideShow").click(function(){
   $("#message").toggle();
});

注意：您的“我的标题”ID是hideShow＆amp;不是hide，也是使用display:none而不是visibility: hidden;。

$("#hideShow").click(function() { $("#message").toggle(); });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<a href="#" id="hideShow">My Title</a>
<div id="message" style="display:none; border: 1px solid #777; width: 400px; padding: 1%;">
    Blah Blah Blah Blah
</div>

Answer 2

如果你想点击鼠标，你可以这样做。其中#hide将是您要点击以显示或隐藏#message的“按钮”或元素的ID。

    $("#hideShow").click(function() {
        $("#message").toggle();
    });

http://api.jquery.com/toggle/

如果您只想在页面加载时自动发生而不点击按钮，您可以这样做：

    $(document).ready(function() {
        $("#message").show(4000);
        $("#message").hide(3000);
    });

4000和3000分别等于4秒和3秒。这是完全显示然后完全隐藏所需的时间量。不管你喜不喜欢调整。

Answer 3

试试这个：

$(function () {
$("#hideShow").click(function () {
    $("#message").toggle();
});

}）;

http://jsfiddle.net/669k4/

更改了可见性：无显示：无。

Answer 4

Try This:

  <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript"> 
$(document).ready(function() {
    $("#hide_show").click(function() {
         $("#message").toggle();
       });
    });
</script>

<a href="#"  id="hide_show" title="toggle(show/hide)">My Title</a>
<div id="message" style=" display:none; border: 1px solid #777; width: 400px; padding: 1%;">
    Blah Blah Blah Blah
</div>

Answer 5

试试这种方式

<a href="#" id="hideShow">My Title</a>
<div id="message" style="display:none; border: 1px solid #777; width: 400px; padding: 1%;">
  Blah Blah Blah Blah
</div>

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript"> 
$(function(){
  $("a#hideShow").bind("click", function(){
    $("#message").toggle();
 });
});
</script>

演示：http://jsfiddle.net/6KRgn/5/

Answer 6

根据你甚至没有定义的东西的切换事件显示/隐藏你的div“$（”＃hide“）”没有id =“hide”的元素。

你必须考虑你想要的东西，如果你想根据链接中的点击显示/隐藏消息，你可以这样：

$("#hideShow").click(function(){
   $("#message").toggle();
});

创建显示/隐藏链接 - HTML和CSS

的HTML

6 个答案: