gpt4 book ai didi

Javascript:按名称显示/隐藏多个元素

转载 作者:行者123 更新时间:2023-12-02 20:36:20 26 4
gpt4 key购买 nike

当单击另一个元素时,我需要显示/隐藏具有相同名称的多个元素,例如 <code><span name="showhide" value="one" id="button">Click to Hide One</span></code>
<code><span name="showhide" value="two" id="button">Click to Hide Two</span></code>
<code><span name="showhide" value="shoe" id="button">Click to Hide shoe</span></code>
单击时将隐藏具有相应值的元素
<code><span name="showhide" value="one">One</span></code>
<code><span name="showhide" value="two">Two</span></code>
<code><span name="showhide" value="shoe">shoe</span></code>

此外,onclick=''不能在 HTML 中使用,必须在脚本中使用。除了 href 之外,也无法将任何属性应用于标签(这是针对 MediaWiki)

我尝试了很多不同的方法,但似乎无法使其发挥作用,有人有任何建议吗?

最佳答案

标记无效:没有 <span name> 这样的属性或<span value> ,并且不能有多个具有相同 id 的元素。所有这些都可能会混淆您通过名称或 ID 获取元素的任何尝试。使用class相反,由于您拥有的是指向页面其他部分的链接,因此将它们标记为内部链接似乎是明智的。您始终可以使用 CSS 设置它们的样式,使其看起来不像链接。

<a class="showhide" href="#one">Click to hide one</a>
<a class="showhide" href="#two">Click to hide two</a>

<div id="one">One</div>
<div id="two">Two</div>

<script type="text/javascript">
for (var i= document.links.length; i-->0;) {
var link= document.links[i];
if (link.className=='showhide') {
var div= document.getElementById(link.hash.substring(1));
Toggler(link, div, true);
}
}

function Toggler(toggler, togglee, state) {
toggler.onclick= function() {
state= !state;
togglee.style.display= state? 'block' : 'none';
return false;
}
}
</script>

关于Javascript:按名称显示/隐藏多个元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3198385/

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