Javascript函数，用于根据另一个字段中的用户输入填充字段

Question

这涉及HTML表单中的javascript。 我遇到的问题是根据另一个字段的用户输入以相同的形式填充一个字段。 当用户输入字母等级（A，B或C）时，我试图根据字母等级（A＆B = 100，C = 75）将百分比字段更新为100或75。 以下是我到目前为止尝试过的方法，它似乎无法正常工作。

function PercentResult(grade)
{
  if (grade.equalsIgnoreCase("A"))
  {
    return 100;
  }
  if (grade.equalsIgnoreCase("B"))
    return 100;
  if (grade.equalsIgnoreCase("C"))
    return 75;
  return 0;
}

Answer 1

Javascript中没有“equalsIgnoreCase”; 你可能会对完全不同的Java语言感到困惑。

我只是使用查找：

function percentResult(grade) {
  var grds = { 'A': 100, 'B': 100, 'C': 75 };
  return grds[grade.toUpperCase()];
}

（有一些方法可以定义更有效的查找，但这只是一个例子。）

编辑 —到处搜索我确实找到了一些对Java脚本执行“ equalsIgnoreCase”的示例实现，但是它们大多是大写或小写值比较的简单包装。 在这种情况下，实际上并不需要它。

Answer 2

最简单的方法是使用约束集 - 输入框的组合框

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Grades</title>
</head>
<body>
    <form>
        <table>
            <tr>
                <td>Combo Box</td>
                <td>
                    <select id="combo1" name="combo1" onchange="input1.value = combo1.value">
                        <option value="100">A</option>
                        <option value="75">B</option>
                        <option value="50">C</option>
                        <option value="25">D</option>
                        <option value="0"">E</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>Input Box</td>
                <td>
                    <input type="text" name="input1" id="input1"/>
                </td>
            </tr>
        </table>
    </form>
</body>
</html>

除此之外，或者如果你真的需要事件处理程序，你应该对它们进行编码。 这是一个满足您需要的小示例：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Grades</title>
<script type="text/javascript">
    function eventHandler() {
        var target = document.getElementById('input1');
        var value = document.getElementById('input2').value;
        value = value.trim().toUpperCase();
        if( value == "A" ) {
            target.value = "100%";          
        }
        else if( value == "A" ) {
            target.value = "100%";          
        }
        else if( value == "B" ) {
            target.value = "75%";           
        }
        else if( value == "C" ) {
            target.value = "50%";           
        }
        else if( value == "D" ) {
            target.value = "25%";           
        }
        else if( value == "E" ) {
            target.value = "0%";            
        }
    }
</script>
</head>
<body>
<form>
<table>
    <tr>
        <td>Combo Box</td>
        <td><input type="text" name="input2" id="input2"
            onblur="eventHandler()" onchange="eventHandler" value="A" /></td>
    </tr>
    <tr>
        <td>Input Box</td>
        <td><input type="text" name="input1" id="input1" /></td>
    </tr>
</table>
</form>
</body>
</html>

其中一些内容可能非常快速地依赖于浏览器，因此请务必查看您要定位的浏览器的js api文档。

Javascript函数，用于根据另一个字段中的用户输入填充字段

问题描述

2 个解决方案

解决方案1
2 2010-11-08 17:01:49

解决方案2
0 2010-11-08 17:22:40

Javascript函数，用于根据另一个字段中的用户输入填充字段

问题描述

2 个解决方案

解决方案1 2 2010-11-08 17:01:49

解决方案2 0 2010-11-08 17:22:40

解决方案1
2 2010-11-08 17:01:49

解决方案2
0 2010-11-08 17:22:40