Javascript 当选择了其他选项时，如何在选择中显示/隐藏选项

我正在尝试为流行游戏《坐骑与刀锋》制作一个非官方的角色创造测试仪。理论上，脚本应该根据所选择的选项来确定角色的状态，就像在游戏中一样

当我在选择框中选择“男/女”时，指定的字段没有一个消失。我做错了什么

当统计数据被更改时，我想以表格形式自动显示它们，这是否需要我给每个td提供一个id，或者我是否可以参考哪个单元格，就像左边两个单元格下面的第三个单元格一样，是表13,2，还是太难/不可能

下面是Javascript：

//Base Stats - 
var sGender; // Male or Female
var iAgi = 6;
var iStr = 5;
var iInt = 5;
var iCha = 5;


$("#selGender").change(function() {
var mnf = $(this).val();
sGender = parseInt(mnf);
if (sGender = 1){
    //Show/hide options
    $('#fnomad').hide();
    $('#fnoble').hide();
    $('#fsquire').hide();
    $('#mnomad').show();
    $('#mnoble').show();
    $('#msquire').show();
iAgi++;
iInt++;
this.disabled=true;
} else{
    $('#mnomad').hide();
    $('#mnoble').hide();
    $('#msquire').hide();
    $('#fnomad').show();
    $('#fnoble').show();
    $('#fsquire').show();
iStr++;
iCha++;
    this.disabled=true;
    }
}

这是HTML

 <legend>Choose your background:</legend>
     <label>Gender</label>
     <select id="selGender"> 
      <option value="1" >Male</option>
      <option value="2">Female</option>
     </select>
     <label>Your father was ...</label>
     <select id="selFather">
     <option id="fnoble" value="fnoble">a Noble</option>
     <option id="mnoble" value="mnoble">a Noble</option>
     <option value="merchant">a Merchant</option>
     <option value="vetwarrior">a Veteran Warrior</option>
     <option value="thief">a Thief</option>
     <option id="fnomad" value="fnomad">a Nomad</option>
     <option id="mnomad" value="mnomad">a Nomad</option>
     </select>

编辑：另外，我已经确保在标题中链接到jQuery文件

  <script type="text/javascript" src="jquery.min.js"></script>

编辑2：这是mSquire和fSquire所在的部分：

 <label>When you grew to a young adult, you became a ...</label>
     <select id="selAdult">
     <option id="msquire" value="msquire">a Squire</option>
     <option id="fsquire" value="fsquire">a Lady in waiting</option>
     <option value="troubadour">Troubadour</option>
     <option value="student">Student</option>
     <option value="peddle">Peddler</option>
     <option value="poacher">Poacher</option>
     </select>

看

您可以向每个元素添加类，而不是显示/隐藏每个元素：

<select id="selFather">
    <option id="fnoble" value="fnoble" class="f">a Noble (f)</option>
    <option id="mnoble" value="mnoble" class="m">a Noble (m)</option>
    <option value="merchant">a Merchant</option>
    <option value="vetwarrior">a Veteran Warrior</option>
    <option value="thief">a Thief</option>
    <option id="fnomad" value="fnomad" class="f">a Nomad (f)</option>
    <option id="mnomad" value="mnomad" class="m">a Nomad (m)</option>
</select>

您还可以使用以下内容创建CSS样式表：.f{display:none}.m{display:block；}

您的代码有一个问题：如果您有

<select id="selGender">
    <option value="1" >Male</option>
    <option value="2">Female</option>
</select>

你应该使用

if (sGender == 1)

因为您是在比较，而不是设置值

关于您的另一个问题，在表格中导航，您可以创建一个JavaScript函数来实现这一点。但是我不太明白你想要从左下两个单元格的第三个单元格得到什么

编辑：

如果我能理解的话，你有一张这样的桌子

<table id="table">
 <tbody>
   <tr>
     <td>Skill 1</td>
     <td>Skill 2</td>
     <td>Skill 3</td>
   </tr>
   <tr>
     <td>Value 1</td>
     <td>Value 2</td>
     <td>Value 3</td>
   </tr>
 </tbody>
</table>

那么

---

请参见此处：

两者都是可能的。但是给每个单元格指定一个ID很容易，而且没有重要的缺点。您的下拉列表中是否存在msquire或fsquire选项？它在文件的更深处存在我想要3,2单元格等的原因是分配它的值，因此，使用4个统计数据和所有技能等。我会有一个表格，其中4个单元格用于统计标签，4个单元格用于值，即单元格1,2将是Str：当有人在性别框中选择“男性”时，单元格2,2将是我需要更改的值，因为男性会增加强度。出于某种原因，我所有的禁用输入盒子仍处于禁用状态，知道为什么吗？请参阅。您没有很好地关闭事件函数。如果您想启用select，可以在普通javascript中使用.disabled=false或在jQuery中使用.prop'disabled'，false，但不要将它们混合使用。此外，iWpn1h没有定义。当我声明变量时，我输入了一个错误，它应该是iWpn1h，但最终它是iWp1h，当选择一个选项时，我似乎无法通过第三个选择，因为它保持停用状态，尽管在执行之前对它做了相同的声明。-$selmentary.prop'disabled'，false@特立独行的希伯罗基见。我已经改变了变量。您忘记了一些jQuery选择器。一个had id=selsLeave而不是seleave。我已经在开始时删除了这些var，如果您使用，而不是；您可以避免再次使用var。

if (sGender = 1)

if (sGender == 1)

<table id="table">
 <tbody>
   <tr>
     <td>Skill 1</td>
     <td>Skill 2</td>
     <td>Skill 3</td>
   </tr>
   <tr>
     <td>Value 1</td>
     <td>Value 2</td>
     <td>Value 3</td>
   </tr>
 </tbody>
</table>

table(1,1)=Skill 1 cell
table(1,2)=Value 1 cell

table(2,1)=Skill 2 cell
table(2,2)=Value 2 cell

...

function table(col,row){
   return document.getElementById('table').tBodies[0].getElementsByTagName('tr')[row-1].getElementsByTagName('td')[col-1];
}