Question

我有一个将值数组映射到不同单选按钮的困难案例。这是HTML，我已经重命名了变量，使其变得通用，而不是特定于我现在正在制作的特定Web表单。

<input type="radio" NAME="type" id="rbtA"><span id="txtA">Alt. A</span>
<input type="radio" NAME="type" id="rbtB"><span id="txtB">Alt. B</span>
<input type="radio" NAME="type" id="rbtC"><span id="txtC">Alt. C</span>

<input type="radio" NAME="COM" id="rbtSub1"><span id="txtSub1">SubAlt. 1</span>
<input type="radio" NAME="COM" id="rbtSub2"><span id="txtSub2">SubAlt. 2</span>
<input type="radio" NAME="COM" id="rbtSub3"><span id="txtSub3">SubAlt. 3</span>
<input type="radio" NAME="COM" id="rbtSub4"><span id="txtSub4">SubAlt. 4</span>

<input type="radio" NAME="Coupling" id="rbtSubSub1"><span id="txtSubSub1">Yes</span>
<input type="radio" NAME="Coupling" id="rbtSubSub2"><span id="txtSubSub2">No</span>

<SELECT id="selectCom" style="width: 160" NAME="Communication"><OPTION selected="selected"></OPTION></SELECT>

如果选择了替代B或C，将出现单选按钮rbtSub1-rbtSub4。如果选择了C，则rbtSubSub1和rbtSubSub2将保持隐藏状态，但如果选择了B 和（SubAlt.1或SubAlt.2），则会出现rbtSubSub1和rbtSubSub2。要使这些按钮显示/消失是没有问题，问题是根据选择的单选按钮将正确的替代选项映射到selectbox selectCom。

如果selectCom中的备选方案仅依赖于rbtSub1 - rbtSub4，则映射将很容易：

var arraySub1=["1A", "1B", "1C"];
//(correspondingly for sub2 and sub3)...
var arraySub4=["4A", "4B", "4C"];
var mapCom = { rbtSub1 : arraySub1, rbtSub2 : arraySub2, rbtSub3 : arraySub3, rbtSub4 : arraySub4 }

然后在jquery代码中的某处我将使用此代码来填充selectCom，具体取决于用户选择的子备选（这有效，我在表单中使用了其他位置）：

$('#rbtSub1, #rbtSub2, #rbtSub3, #rbtSub4').change(function() {
  $("#selectCom option").remove();
  $.each(mapCom[this.id], function(i, val) {
    var opt = $("<option />");
    opt.appendTo($("#selectCom")).text(val).val(val);
  });
});

棘手的部分是如果选择了rbtB 和（rbtSub1或rbtSub2），我需要填充selectCom，具体取决于用户是选择rbtSubSub1还是rbtSubSub2，但是如果rbt B和（rbtSub3或rbtSub4））如果被选中，我需要根据用户是否选择了rbtSub3或rbtSub4来填充selectCom。此外，如果选择rbtC，我只想根据选择的内容填充selectCom：rbtSub1，rbtSub2，rbtSub3或rbtSub4。

我尝试在同一个映射代码行中映射不在同一级别的单选按钮，但是当我尝试运行表单时会导致错误。

有关如何实现这一目标的任何好建议吗？

Answer 1

最好的解决方案将是在php ...分解html，如果选择值X或X，则在其中放置IF语句echo style =“display：none”

将值映射到不同的单选按钮组

1 个答案: