gpt4 book ai didi

javascript - DIV 内容根据 URL 隐藏/显示

转载 作者:行者123 更新时间:2023-11-28 05:48:28 25 4
gpt4 key购买 nike

在 html 页面中有一个 div-reportControlPanel 如下。我已经包含了另一个 div-reportControlPanel1 相同但 id 不同。

<div id="reportControlPanel" class="pentaho-rounded-panel-bottom-lr pentaho-shadow">
<div id="promptPanel" class="pentaho-rounded-panel-bottom-lr"></div>
</div>

<div id="reportControlPanel1" class="pentaho-rounded-panel-bottom-lr pentaho-shadow">
<div id="promptPanel" class="pentaho-rounded-panel-bottom-lr"></div>
</div>

这里是根据 url 触发显示/隐藏 div 的

    if(prptName == "css.prpt")
{
alert("if");
document.getElementById("reportControlPanel").style.display = 'none';
document.getElementById("reportControlPanel1").style.display = 'block';
}

但是因为我在两个不同的 div 下使用相同的子 Div-promptPanel 我的内容没有正确加载。 promptPanelpentaho系统使用的div。我正在尝试使用另一个 div 来为我的 prpt 修改一些 css

谢谢。

最佳答案

重申一下 Moishe 已经对您说过的话:id 是唯一的。您目前有两个 promptPanel id,这意味着第二个可能永远不会被调用。现在,您可以使用 javascript,但只要对代码的外观了解最少,您就可以使用简单的哈希 url + 一些基本的 css。

$(document).ready(function() {
$('a').click(function() {
$('#url').html($(this).prop('href'));
});
});
div.pentaho-rounded-panel-bottom-lr {
display: none;
}
div.pentaho-rounded-panel-bottom-lr .pentaho-rounded-panel-bottom-lr {
display: block;
}
:target {
display: block !important;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="url"></div>
<a href="#reportControlPanel1">"Open" panel 1</a>
<a href="#reportControlPanel2">"Open" panel 2</a>
<div id="reportControlPanel1" class="pentaho-rounded-panel-bottom-lr pentaho-shadow">
<div id="promptPanel" class="pentaho-rounded-panel-bottom-lr">
this is some text in the first control panel.
</div>
</div>

<div id="reportControlPanel2" class="pentaho-rounded-panel-bottom-lr pentaho-shadow">
<div id="promptPanel" class="pentaho-rounded-panel-bottom-lr">
this is some text in the second control panel
</div>
</div>

关于javascript - DIV 内容根据 URL 隐藏/显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37475540/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com