Question

我有两个div。点击#book1后，系统会显示div #uploadbutton，再次点击#book1时，系统会隐藏div #uploadbuttton。

<html>
    <div id="book1">
    <?php include 'viewing_display_pic.php'; ?>
    </div>

    <div id="uploadbutton">
    <?php include 'upload.php'; ?>
    </div>
</html>

我无法使这种效果起作用。我该怎么办？

Answer 1

$('#book1').click(function() { $('#uploadbutton').toggle() });

这很简单。 toggle会显示当前隐藏的div，或者如果它当前正在显示则隐藏它。

有关toggle的更多信息：

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

Answer 2

我假设你正在使用jQuery：

<script>
    $().ready(function() {
        $('#book1').click(function() {
            $('#uploadbutton').toggle();
        });
    });
</script>

Answer 3

使用$ .toggle。您可以在此处查看文档：{{3}}

$(function(){
   $('#book1').click(function(){
      $('#uploadbutton').toggle();
   });
});

Answer 4

您可以将一个类应用于显示它的#uploadbutton div：

#uploadbutton.shown{
 display: block;
}

然后用jquery切换它;

$('#book1').click(function(){
  $('#uploadbutton').toggleClass('shown');
})

单击div以触发另一个div

4 个答案: