Javascript 在新选项卡中打开DIV？

好的，这就是问题所在。 我有四个分区。 在那个部门里我有文字。 DIV很小，所以在底部我有链接“showmore”。 当我按下该链接时，我需要在新选项卡中打开该DIV，但问题是，在新选项卡中，我需要所有4个DIV，但只是完全打开我在第一页单击的DIV。 有什么想法吗

有人知道我该怎么做吗？？？

---

或者，第二种解决方案是，当我点击“显示更多”链接时，我会得到一个弹出窗口，窗口的右角有“关闭”按钮？有人吗？

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

---

选中此项以供参考

首先，您可以隐藏所有div的内容，并在单击“显示更多”功能时显示“使其成为完整版本”。您应该首先制作一些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> 

函数取消隐藏（divID）{
var item=document.getElementById（divID）；
如果（项目）{
item.className=（item.className='hidden'）？'unhidden'：'hidden'；
}
}

---

这个网站可能会帮助你

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

js

html

Lorem ipsum est dolorum Lorem ipsum est dolorum Lorem ipsum est dolorum

阅读更多
这是一些隐藏的内容
Lorem ipsum est dolorum Lorem ipsum est dolorum Lorem ipsum est dolorum

阅读更多
这是一些隐藏的内容
Lorem ipsum est dolorum Lorem ipsum est dolorum Lorem ipsum est dolorum

阅读更多
这是一些隐藏的内容
Lorem ipsum est dolorum Lorem ipsum est dolorum Lorem ipsum est dolorum

阅读更多
这是一些隐藏的内容

打开四个选项卡创建一个新页面，如果您使用jquery选项卡，只需将哈希id传递给url，它就会在该选项卡上打开。您的问题不清楚。您是指页面内的新选项卡，还是新浏览器选项卡？如果使用“新建浏览器”选项卡，则需要指向仅显示该div的页面的链接，这可能是因为该div是页面上唯一可见的html，也可能是因为url中的参数或其他数据传输机制（postmessage/localstorage/cookie）告诉页面这样做。我建议使用jQueryUI对话框实现第二个解决方案。这个问题不清楚非常好，Pete，但是我如何将哈希id传递到url？对不起，我的英语不好，这是我的问题。感谢兄弟们帮助我做了

slideToggle

而不是

slideDown

-Slavenko brate hvala si dobar si covjek，ne znam kako da objasnim ovoj braci na Englescom:）@bostaq_sb9哈哈哈，samo cepaj:）

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

<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>