0

我很清楚,在单选按钮方面已经回答了使用显示/隐藏功能,但我已经在高处和低处搜索了解决我的问题的方法。我试图做的是创建一个表单,访问者有几个选项可供选择,他们单击其中一个选项,它显示一个隐藏的 div 并在该 div 内为访问者提供更多选项可供选择。这就是我遇到问题的地方。我想做的是让第一个隐藏的 div 在选择该 div 内的一个选项以显示该按钮隐藏的内容后保持显示。

这是我目前正在研究的 jfiddle - http://jsfiddle.net/UDEQZ/

这是html

<input name="pagetype" type="radio" onclick="show(0)" />First
<input name="pagetype" type="radio" onclick="show(1)" />Second
<input name="pagetype" type="radio" onclick="show(2)" />Third
<p></p>
<div id="d0" class="CF" style="display:none;">Select One:
<p></p>
<input name="pagetype" type="radio" onclick="show(3)" />One
<input name="pagetype" type="radio" onclick="show(4)" />Two
<input name="pagetype" type="radio" onclick="show(5)" />Three
<input name="pagetype" type="radio" onclick="show(6)" />Four
<input name="pagetype" type="radio" onclick="show(7)" />Five
<input name="pagetype" type="radio" onclick="show(8)" />Six
<input name="pagetype" type="radio" onclick="show(9)" />Seven</div>
<div id="d1">Two</div>
<div id="d2">Three</div>
<div id="d3">Hazaa</div>
<div id="d4">Bazinga</div>
<div id="d5">Hazaa</div>
<div id="d6">Bazinga</div>
<div id="d7">Hazaa</div>
<div id="d8">Bazinga</div>
<div id="d9">Hazaa</div>

这是我正在使用的脚本

function show(number) {
"use strict";
var el, i = 0;
while (el = document.getElementById("d" + (i++))) {
    el.style.display = "none";
}
document.getElementById('d' + number).style.display = "block";
}

对于 HTML,我尝试过的一件事,对我来说,应该可以使用,onclick="show(3)"我将其更改为onclick="show(0, 3)"但是当您单击旁边有 One 的单选按钮时,什么也没发生。

我还是 javascript/jquery 的新手,我已经看到很多单选按钮问题都使用了显示/隐藏,但我还没有看到解决方案,甚至没有看到与我遇到的问题有关的问题。我尝试了一些不同的选项,通过数组运行它(仍然有点像啊?在那个哈哈),使用显示/隐藏功能,以及在此处和其他站点上描述的多种其他方式。出于某种原因,我觉得解决方案似乎非常简单,而我只是太愚蠢了,无法看到它被张贴或跳过。

4

1 回答 1

0

由于 jquery 被标记我正在使用 jquery 来减少你的代码..

function show(number) {

  $('[id^="d"]').hide();
  if(number >=3){
    $('#d0').show();
  }
  $('#d' + number).show();
}

但是,这是考虑到所有其他 div,例如d3,d4,d5,d6..d0.. 我在这里所做的是使用属性选择器$('[id^="d"]'),它选择所有以开头的元素 idd并隐藏它......所以这隐藏了所有元素.. 然后检查是否number 参数 > 3 ..如果大于 3 then ,显示#d0元素..,然后只显示 id 为 = 的元素number

在这里摆弄

于 2013-07-09T18:02:12.427 回答