logo标签列表

使用JavaScript更改HTML表单输入

javascripthtmlforms
5
我正在尝试为Pathfinder游戏制作可编辑的角色表。我有一个用于选择种族的<select>，每个种族都有一个值集。但我的值是字符串。当选定一种种族时，我需要更新一个输入表格。
Javascript应该为将要修改的状态分配一个变量。然后用户键入基本状态数字，完成后，Javascript将从用户输入的值中添加或减去修饰器。
例如：矮人的体质得分增加了+2。因此，当用户从下拉菜单中选择矮人时，我需要我的脚本识别并声明一个等于2的变量。然后用户会键入基本状态，比如13。一旦他们完成输入这个数字，代码将自动更新输入字段为15。
我已经弄清楚了如何处理<p>等内容，但无法处理文本输入。我意识到简单的方法是将选项值设置为奖励数字，但是种族影响3个状态，其中两个积极，一个消极。因此，我只能理解如何使用if / else语句来实现这一点。我非常新手。
这是我的代码。非常感谢任何帮助。
<script>
function createModifier () {

var race = document.getElementById("race");

if (race = "cat") {
    var strMod = 3;
}
else {
    var strMod = 1;
}
document.getElementById("strElm").innerHTML = 10 + strMod;
}
</script>
</head>
<body>

<form>
    <div id="raceSelector" class="attribute">
<p><strong>Race</strong></p> 
  <select name="race" id="race">
<option value="aas">Aasimar</option>
<option value="cat">Catfolk</option>
<option value="cha">Changeling</option>
<option value="dha">Dhampir</option>
<option value="dro">Drow</option>
<option value="due">Duergar</option>
<option value="dwa">Dwarf</option>
<option value="elf">Elf</option>
<option value="fet">Fetchling</option>
<option value="gil">Gillman</option>
<option value="gno">Gnome</option>
<option value="gob">Goblin</option>
<option value="gri">Grippli</option>
<option value="hale">Half-Elf</option>
<option value="half">Halfing</option>
<option value="halo">Half-Orc</option>
<option value="hob">Hobgoblin</option>
<option value="hum">Human</option>
<option value="ifr">Ifrit</option>
<option value="kit">Kitsune</option>
<option value="kob">Kobold</option>
<option value="mer">Merfolk</option>
<option value="nag">Nagaji</option>
<option value="orc">Orc</option>
<option value="ore">Oread</option>
<option value="rat">Ratfolk</option>
<option value="sam">Samaran</option>
<option value="str">Strix</option>
<option value="sul">Suli</option>
<option value="svi">Svirfneblin</option>
<option value="syl">Sylph</option>
<option value="ten">Tengu</option>
<option value="tie">Tiefling</option>
<option value="und">Undine</option>
<option value="van">Vanara</option>
<option value="vis">Vishkanya</option>
<option value="way">Wayang</option>
</select>
</div>
<div class="attribute">
  <input type="text" onchange="createModifier()"></input>
  <p id="modStr"></p>
</div>
/form>
Java != Javascript - nnnnnn
你可以使用"switch"语句来实现这个功能，根据用户选择的种族进行判断。 - Anirudh
@Anirudh，事实证明switch语句比简单的2条件if/else语句慢。但只慢了几毫秒，差别不大。 - Mark Eriksson
你的 strElm 元素在哪里？ - asprin
将每个种族都变成一个对象字面量：var elf = { str: 0, int: 0, wis: -1, Dex: 1, con: -1, cha: 1 }，并创建一个默认角色：var base = { str: 10, int: 10, wis: 10, dex: 10, con: 10, cha: 10 }。 - zer00ne
显示剩余2条评论
3个回答
2
你所说的是 if (race = "cat")，这会让 race 的值等于 cat，而不是判断是否相等。你需要使用 == 而不是 =。
总之，你的问题在于这一行代码。
var race = document.getElementById("race");

应该是这样的

var race = document.getElementById("race").value;
0

把它改成怎样？

if (race.value == "cat") {
var strMod = 3;
0
上述代码行的错误在于您没有比较字符串。
if (race = "cat") {

应该被更改为

if (race.value == "cat") {
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接