Question

我创建了2个输入字段和1个选择字段，我应用onchange（）函数来选择调用javascript的标记，该脚本进行计算并在其他两个字段中显示但由于某些语法或逻辑原因，它无法正常工作。请看看我的代码，任何帮助将不胜感激。

<html>
<head>
<script type="text/javascript">
function update() {
var x = document.getElementsByName("n_person").value;
document.getElementsByName("m_income").value= x*5;
document.getElementsByName("y_income").value= x*4;
}
</script>
</head>

<body>


<div class="elist"> <span class="b_text"><span>*</span>Level 1:</span>
// here is select tag where I put onchage function  <select class="ifield" name="n_person" onChange="update()">
    <option value="" selected="selected">Choose no. of person referred</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
  </select>
// These are teh input where resultant value will appear  <input type="text" value="" placeholder="Your weekly Income..." name="m_income" id="weekly_income" class="field" readonly required />
  <input type="text" value="" placeholder="Your day Income..." name="y_income" id="day_income" class="field" readonly required/>
</div>
<!--elist-->

</body>
</html>

Answer 1

请参阅此fiddle

更新了JS

function update() {
  var x = document.getElementsByName("n_person")[0].value;
  document.getElementsByName("m_income")[0].value = x * 5;
  document.getElementsByName("y_income")[0].value = x * 4;
}

您的JS存在的问题是您没有使用getElementsByName定位正确的HTML元素。

请详细了解here

Answer 2

方法getElementsByName，如其名称所示，返回具有指定名称而不仅仅是一个元素的元素列表。在您的情况下，名称对于文档是唯一的，并且该方法将返回仅包含一个值的列表，但您仍然需要索引此列表。因此，您必须更改此内容：

var x = document.getElementsByName("n_person").value;

到

var x = document.getElementsByName("n_person")[0].value;

这也适用于getElementsByName的其他用途，您的代码也可以使用。

Javascript onchange函数无法处理选择标记

2 个答案:

请参阅此fiddle