使用getElementsByName代替getElementById

时间:2019-02-17 01:19:45

标签: javascript

我有一个使用getElementById.innerHTML的计算票价,却使用<h5 id="totalFare"></h5>显示了总票价,但是如果我想通过使用<input type="number" name="totalFare" readonly />在getElementsByName中解析getElementByID,我正在搜索很多页面找到答案,下面是我的代码。我希望你能帮助我。

<input type="number" id="adults" min="0" onkeyup="calculate()"  name="booking[adults]" class="validate" value="0" required>

<input type="number" id="children" min="0" onkeyup="calculate()" name="booking[children]" class="validate" value="0"   required>

<input type="number" id="senior" min="0" onkeyup="calculate()" name="booking[senior]" class="validate" value="0"  required>


<script type="text/javascript">
  function calculate(){
    var adults   = document.getElementById("adults").value;
    var children = document.getElementById("children").value;
    var senior = document.getElementById("senior").value;
    var Fare = document.getElementById("hideFare").value;


    var values = fare(adults, children, senior, Fare);

    console.log(values)
    document.getElementById("totalFare").innerHTML = values.totalFare;

  }
    function fare(x, y, z, a) {
    var res = {};
    res.totalFare = (( x  * a) + (y * (a *.80)) + (z * (a *.80)))
    return res
  }

</script>

1 个答案:

答案 0 :(得分:0)

像下面一样使用getElementsByName

console.log(document.getElementsByName("test")[0].value);
<input type="text" name="test" id="testing" value="This is a value" />

document.getElementsByName("test")为您提供了一个类似数组的东西(由于可能有多个具有相同名称的元素,因此称为元素集合),因此[0]在那里获得第一个索引,即想要的价值。请查看下面的链接以获取更多信息。

https://www.w3schools.com/jsref/met_doc_getelementsbyname.asp