在单选选项中显示/隐藏 div

发布于 2024-08-30 07:07:17 字数 429 浏览 1 评论 0原文

我有 3 个 div,其中包含带有标签的单选按钮,在每个单选按钮下方,我想根据是否选择单选按钮来显示/隐藏一个表单。

代码想法:

<div id="radio1"></div>
<div id="form1"></div>

<div id="radio2"></div>
<div id="form2"></div>

<div id="radio3"></div>
<div id="form3"></div>

使用原型是否有人对实现此目标的最佳方法有任何基本想法或建议。任何建议的脚本或链接将不胜感激。我是原型的新手,很难掌握这个概念或在网上找到任何有用的东西。理论上,我认为这不会太复杂,但提前感谢您的帮助。

I have 3 divs that contain radio with labels and beneath each radio button I would like to show/hide a form based on whether the radio is selected or not.

Code idea:

<div id="radio1"></div>
<div id="form1"></div>

<div id="radio2"></div>
<div id="form2"></div>

<div id="radio3"></div>
<div id="form3"></div>

Using prototype does anyone have any basic idea or suggestion on the best way to accomplish this. Any suggested scripts or links would be greatly appreciated. I am a newbie to prototype and having a hard time grasping the concept or finding anything helpful online. In theory I wouldn't think this would be too complicated but thanks in advance for any help.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

北恋 2024-09-06 07:07:17

使用此模式:

<div onclick="$('form1').toggle()" id="radio1"></div>
<div id="form1" style="display"none"></div>

您也可以将它们链接在一起来控制其他元素:

<div onclick="$('form1').toggle();$('form2').hide();$('form3').hide()" id="radio1"></div>
<div id="form1" style="display"none"></div>

有更好的方法可以做到这一点,例如选择具有相同类的所有元素,隐藏它们,然后显示单击的元素。但从初学者的角度来看,这应该可以满足您的要求。

Use this pattern:

<div onclick="$('form1').toggle()" id="radio1"></div>
<div id="form1" style="display"none"></div>

You can chain these together to control other elements as well:

<div onclick="$('form1').toggle();$('form2').hide();$('form3').hide()" id="radio1"></div>
<div id="form1" style="display"none"></div>

There are better ways to do this, such as selecting all of the elements that have the same class, hiding them, then showing the clicked element. But from a beginner's point of view, this should do what you want.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文