使用JavaScript更改HTML表单输入

Changing an HTML form input with JavaScript

本文关键字：表单 输入 HTML 更改 JavaScript 使用      更新时间：2023-09-26

我正在为游戏《探路者》制作一个可编辑的角色表。我有一个用于选择比赛的<select>和为每个比赛设置的值。不过，我的值是一个字符串。我需要做的是，当比赛被选中时，我需要更新一个输入表格。

Javascript应该为要修改的stat分配一个变量。然后，用户将键入基本统计数字，完成后，javascript将从用户输入的值中添加或减去任何修饰符。

例如：一个侏儒的体质得分为+2。因此，当用户从下拉菜单中选择dwarf时，我需要我的脚本来识别它，并声明一个等于2的变量。然后用户会输入基本统计数据，比如说13。一旦他们输入完该数字，代码就会自动将输入字段更新为15。

我已经想好了如何为<p>这样的东西做到这一点，但我无法为文本输入找到它。我意识到最简单的方法是将选项值设置为奖金数字，但比赛影响3个统计数据，两个是正面的，一个是负面的。所以我只能理解如何使用in/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>

您说的是if (race = "cat")，它告诉race等于cat，而不是确定它是否等于。您需要使用==而不是=

不管怎样，你的问题在于这条线

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

应该是

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

把它改成怎么样

if (race.value == "cat") {
var strMod = 3;

上面一行代码中的错误是没有比较字符串。

if (race = "cat") {

应该改为

if (race.value == "cat") {
相关文章：