Question

好的，这是个问题。我有4个DIV。在DIV里面我有文字。 DIV很小，所以在底部我有链接“显示更多”。当我按下该链接时，我需要在新标签中打开DIV，但关键是在新标签中我需要拥有所有4个DIV但只是完全打开DIV我点击了第一页。有什么想法吗？

有谁知道我该怎么做？

或者，第二个解决方案是，当我点击“显示更多”链接时，我得到弹出窗口全文，右边有关闭按钮？任何人吗？

Answer 1

就个人而言，我会避免弹出窗口和新标签，因为根据你的问题判断，没有必要这样做。我可能会将隐藏的内容放在你的div中（例如，在你的阅读更多链接下面），这些内容会在“Readmore”链接点击时使用jQuery向上/向下滑动。

DEMO

js

 $('.readmore').click(function(){    
        $('.hidden').slideUp(200);    
        var divToShow = $(this).parent().find('.hidden');    
        divToShow.slideDown(300);    
    });

html

<div class="content">
    <p>Lorem ipsum est dolorum Lorem ipsum est dolorum Lorem ipsum est dolorum</p>
    <span class="readmore">Read more</span>
    <div class="hidden">This is some hidden content</div>
</div>

<div class="content">
    <p>Lorem ipsum est dolorum Lorem ipsum est dolorum Lorem ipsum est dolorum</p>
    <span class="readmore">Read more</span>
    <div class="hidden">This is some hidden content</div>
</div>

<div class="content">
    <p>Lorem ipsum est dolorum Lorem ipsum est dolorum Lorem ipsum est dolorum</p>
    <span class="readmore">Read more</span>
    <div class="hidden">This is some hidden content</div>
</div>

<div class="content">
    <p>Lorem ipsum est dolorum Lorem ipsum est dolorum Lorem ipsum est dolorum</p>
    <span class="readmore">Read more</span>
    <div class="hidden">This is some hidden content</div>
</div>

Answer 2

尝试使用Jquery UI对话框打开弹出窗口并在其中显示div的内容。

选中此link以获取参考

Answer 3

首先你可以隐藏所有div的内容，点击时显示更多功能show make it full version。你应该首先制作一些css：

   .hidden { display: none};

   .unhidden { display: block; }

脚本示例：

    <script type="text/javascript">
     function unhide(divID) {
      var item = document.getElementById(divID);
    if (item) {
       item.className=(item.className=='hidden')?'unhidden':'hidden';
              }
                           }
    </script>

http://www.w3schools.com/jquery/jquery_hide_show.asp此网站可能会对您有所帮助

在新标签中打开DIV？

3 个答案: