从另一个页面展开各种引导折叠div。

Question

我有2个php文件。这是第一个文件: services.php

<a href="#services1" data-collapse-group="servicesgroup" data-toggle="collapse" data-target="#services1">
<div class="button-blue">Learn More</div>
</a>

<a href="#services2" data-collapse-group="servicesgroup" data-toggle="collapse" data-target="#services2">
<div class="button-blue">Learn More</div>
</a>

<div class="solutions">
  <div id="services1" class="collapse" >
    <section> CONTENT </section>
    <section> MORE CONTENT </section>
  </div>

  <div id="services2" class="collapse" >
    <section> CONTENT </section>
    <section> MORE CONTENT </section>
  </div>
</div>

第二个文件index.php有两个必须链接的web横幅：

第一个网页横幅链接到services.php#services1

第二个网页横幅链接到services.php#services2

当我点击index.php中的第一个网页横幅时，我需要它只展开#services1 1可折叠的div。

当我点击index.php中的第二个web横幅时，我需要它只展开#services2可折叠的div。

我当前的Javascript函数用于从services.php中的按钮展开/折叠：

//Bootstrap Collapse Group from within Page

$("[data-collapse-group='servicesgroup']").click(function () {
var $this = $(this);
$("[data-collapse-group='servicesgroup']:not([data-target='" +  
$this.data("target") + "'])").each(function () {
    $($(this).data("target")).removeClass("in").addClass('collapse');
});
});


//Bootstrap Scroll Up

$("div").click(function() {
$('html,body').animate({
    scrollTop: $(".solutions").offset(500).top},
    'slow');
});

从另一页链接的半功能Javascript：

这是我发现的唯一一个似乎半工作的Javascript，因为当我点击index.php上的网页横幅时，它会在services.php页面上打开可折叠的div，但是services.php上的按钮的功能不会扩展或折叠我的div。它还打开所有可折叠的div，当我需要它打开其各自的可折叠div时(即当单击index.php上的第一个或第二个web横幅时#services2 1或#services2 2)。

$(document).ready(function () {

$(".collapse").hide();

$(".solutions").click(function () {

    $(this).next(".collapse").slideToggle(400);
});    

if(window.location.hash && window.location.hash.replace("#", "") == "services1"){
    $('.collapse').show();  
}

})；

我是一个新手的javascript，所以我将需要一个逐步的解释或确切的复制和粘贴代码，请。

任何帮助都是非常感谢的。

Answer 1

谢谢上帝！在对该网站和多个网站进行了大量搜索之后，这些站点的主题是“引导崩溃”，从外部链接(另一页)打开div，但没有发现任何结果，以下工作如下：

1. 代码适用于：外部页面链接以展开另一页上的折叠DIV，但在单击同一页上的其他折叠按钮时不会隐藏折叠DIV： .ready(函数(){ $(window.location.hash).show()；})；
2. 代码用于：外部页面链接以展开另一页上的折叠DIV，并在单击其他折叠按钮时隐藏折叠DIV。其他按钮的折叠功能正常工作： $(document).ready(function() {$(window.location.hash).addClass(‘折叠in’；})；
3. 包含多个链接的第一个文件(index.php)将DIV锚折叠到另一个页面： 链接图像: services.php#services1链接图像: services.php#services2链接图像: services.php#services3
4. 包含折叠DIVS的第二个文件( services.php )：services.php 学习更多内容
5. 第三个文件(services.js)包含当前的Javascript函数，用于从services.php中的按钮展开/折叠： //从外部链接展开折叠DIV和内部折叠按钮工作$(.ready).ready(函数() {$(window.location.hash).addClass(‘联合国’)；}；//从页面内部折叠DIV组(){ var $this = $(this)；$("data-collapse-group='servicesgroup':not(data-target='“+$this.data(”目标“)+”‘)).each(函数() { $($(this).data("target")).removeClass("in").addClass('collapse')；})；}；//在页$(“DIV”).click(函数(){ $('html，body').animate({ scrollTop：$(".solutions").offset(500).top}，'slow')；}中单击折叠按钮时向上滚动div；